Share your repls and programming experiences

← Back to all posts
Alpha Guys Cookie code - The best live code editor ever - better than codepen - must see!
LegendaryWolf (701)

Hi and welcome to our other post...

A Live IDE editor better that CodePen

Credits -

@Coder100 - 55% (syntax highlighting and pro theme)
me - 40% (compiling JS and css)
@IntellectualGuy - 5% (css)

Instructions -

1st column is for HTML
2nd column is for CSS
and finally, the last column is for JS

This took us a lot of time so updoot if you like :)

This is our biggest project

Comment for any changes to make (probably no changes, it's perfect!)

GG - Hope you like it ;)

Comments
hotnewtop
Whippingdot (573)

THIS IS A DISGRACE TO CODEPEN. Everyone go to Codepen.io and see their amazing site. They have a WAY better designed site, and there you can save ur pages and you can create an account. Codepen is a little like repl.it. Don't advertize ur thing wrong or people like me will get u for that

snakebite382 (3)

@Whippingdot this isn't meant to replace codepen it's just a cool project by one dude

Whippingdot (573)

no, I am saying this for real, this is not that good. As said below, it was made using monaco. Don't say this is better than Codepen as that is a lie @LegendaryWolf

Whippingdot (573)

I know but he said in the description that it might be better than codepen... @snakebite382

LegendaryWolf (701)

only monaco, the rest of the code - index, script and script.js is ours... we used monaco only for syntax highlighting, the rest of the code, compiling JS and css in made by meh

Whippingdot (573)

@OldWizard209 Bruh this comment does seem mean...welp i over-reacted but you don't have to be mean about it...Even LegendaryWorf took it as a joke...Also i ain't dumb i saw ur comment in my email

ch1ck3n (1629)

@LegendaryWolf why can't you just make your own syntax highlighting

BobTheTomatoPie (3345)

you reacted perfectly, i agree with you 100% @Whippingdot

Whippingdot (573)

Thanks!! I really appreciate the support lul this sounds cringe even tho i don't know what cringe means @BobTheTomatoPie

ch1ck3n (1629)

@Whippingdot 1. i don't know how
2. i don't really want to

tussiez (1531)

@LegendaryWolf The rest of the code is around Monaco

Whippingdot (573)

no i wasn't asking why YOU can't i was asking why HE can't but pinging u as u made the comment @ch1ck3n

Whippingdot (573)

ya i didn't understand a single thing either of u said @tussiez

LaneMartin (87)

@tussiez never expect u here tussiez, hey, ppssssssttttt, F.R.I.E.N.D.S. ?

tussiez (1531)

@LaneMartin #### f.r.i.e.nd.s. ig lol

LaneMartin (87)

@tussiez u see this on twitter "##"

BobTheTomatoPie (3345)

why did you comment three times on your own post? each of them complimenting your work @LegendaryWolf

Whippingdot (573)

to get upvotes smone is upvoting every comment @BobTheTomatoPie

Whippingdot (573)

Brah who is spam upvoting everything here. This dude got 12 upvotes from his own comment @BobTheTomatoPie

BobTheTomatoPie (3345)

idk he prolly has a ton of alts or smthn @Whippingdot

Whippingdot (573)

BRUH WHAT THE DSLFJAS;LFSADFJSAD; HE HAS ALMOST AS MANY UPVOTES AS MEEEE @BobTheTomatoPie

Whippingdot (573)

I think @hacky and @ImOof are his alts. They upvoted almost ALL of his posts. @BobTheTomatoPie

LegendaryWolf (701)

@Whippingdot! what da.... idk about @ImOof but @hacky is not my alt! Im saying da truth!

tussiez (1531)

@Whippingdot Oof - foodandmoarfood upvotes about all my posts, which looks kinda sus on the outside but he’s my friend lol

BobTheTomatoPie (3345)

report him and see what repl thinks, cause i agree with you @Whippingdot

tussiez (1531)

@BobTheTomatoPie Yeah, I can too if you want

Whippingdot (573)

I already reported him twice for this. Once for reposting every post he does a million times, and one for these maybe alts. I hope replit check on this @BobTheTomatoPie! @tussiez it would be nice if you also reported! Also this dude said that they are not his alts, and hacky is his brother, one of the people is his friend, and one of them is his alt. That still counts as alts cause he gets 3 free upvotes per post/comment.

LegendaryWolf (701)

lol, @hacky doesn't upvote my comments... and BTW I said hacky to not upvote my posts. If ya want, warn me but don't ban as It's not my fault, its my brother's as he is upvoting my posts!

LaneMartin (87)

@LegendaryWolf you're acting very suspeciously, wonder if you're in a network of alts

LaneMartin (87)

@LegendaryWolf So, he must be your siblings or something... hmmmm

LeviathanCoding (343)

It's great, but I'd still prefer codepen.

ImOof (4)

woahhhh!!!!!!!!!! you guys r awesome!

Hacky (12)

2nd updoot! and BTW WOW

CodingRedpanda (180)

@LegendaryWolf nice!
i wouldnt say its better than codepen, but its rly good!

OldWizard209 (1123)

Yeah bruhhhh, how do u run the code, I wrote some and mistakenly pressed the run button on the repl and lost it

LegendaryWolf (701)

It runs automatically. that's what a live editor means! And ya know what, this @whippingdot is always jealous of meh.

LegendaryWolf (701)

it runs automatically

CSharpIsGud (931)

@LegendaryWolf Also few people are jealous of this, basically every person that isn't knows they can make the same thing as this in an hour.

OldWizard209 (1123)

exactly that was my point before i deleted the message. @CSharpIsGud

Whippingdot (573)

Bruh do you still hate me?? I promise I just try to spot out bad posts and don't mean to hurt people. i will try to be more kind... @OldWizard209

Whippingdot (573)

Hey stop going around splattering dirt on my name. I always tell you to stop spam posting, and this time u said the thing u made was better than codepen. You should call stuff out like that for fun. Think more logically before doing something from now on!! Also why would i be jealous of u brah, i know i am trash at coding but i never say anything bad about someone else's post when they make a really good one. Like CSharp's bob was awesome and i never said anything bad about it - proving that i was jealous @LegendaryWolf

OldWizard209 (1123)

NO we cool. I didnt even mean to be mean. Just wanted to make a point that you shouldn't really "not like" everything kinda. Keep up with the quality of what is made, where its made and how its made. @Whippingdot

LaneMartin (87)

@LegendaryWolf you should prob take back the part where u say @whippingdot is jealous cuz I think you're putting him in a spot so that you can hide your embarrassment from everyone else. Again, not to be mean, just telling thing from my POV.

CSharpIsGud (931)

This is just microsoft's monaco editor thrown together in html. So this really just a html/css/js repl with monaco thrown in and some js(a single function, the rest is monaco setup) to throw code from the 3 (made by microsoft)editors together.

RohilPatel (1535)

Exactly. Like why does this even matter in the first place when you can just do copy paste? @CSharpIsGud

LegendaryWolf (701)

monaco was @coder100's idea for auto completion and syntax highlighting. rest of the code is mine

LegendaryWolf (701)

repl.it also uses monaco

CSharpIsGud (931)

@LegendaryWolf He meant that you advertised it as a code editor, but it's basically the same as if you were to just install vs code.

ch1ck3n (1629)

@CSharpIsGud Whats the point of a new text editor if it used a super pouplar text editor engine

CSharpIsGud (931)

@ch1ck3n I don't know but it would still impress 70% of replit just by doing nothing.

Whippingdot (573)

lul then should I now upvote? Also

@CSharpIsGud Lul how did you message after ch1ck3n but have ur message below him

LegendaryWolf (701)

@CSharpIsGud, VS thingy is just for syntax highlighting, the compilation program (a very long file) if made by us...

ch1ck3n (1629)

@LegendaryWolf how hard is it to just put an iframe and put the js and css and html code in there

CSharpIsGud (931)

@LegendaryWolf It's not a very long file at all. It's only 87 lines and that includes the monaco setup.

function compile() {
		let html = htmlEditor.getValue();
		let css = cssEditor.getValue();
		let js = jsEditor.getValue();
		let code = document.getElementById("code").contentWindow.document;

		document.body.onkeyup = function () {
			code.open();
			code.writeln(
				html +
				"<style>" +
				css +
				"</style>" +
				"<script>" +
				js +
				"</script>"
			);
			code.close();
		};
	}

This is it. The rest is just setting up monaco.

LegendaryWolf (701)

The css also counts...

CSharpIsGud (931)

@LegendaryWolf And no... the css does not also count. Besides its barely 90 lines too.
I'm sure there are a number of posts on repl that easily top 1000+ lines without even using any super beautification nonsense.

ch1ck3n (1629)

@BananaJellyfish Monaco is an embeddable text editor made by Microsoft, it's what repl.it uses.

CSharpIsGud (931)

@BananaJellyfish monaco is the editor microsoft made for VS Code, and since VS Code runs on electron it also runs in a web browser.

ch1ck3n (1629)

@CSharpIsGud ooh i didnt know it ran on electron

LaneMartin (87)

@CSharpIsGud kinda sus even tho i have no clue how java works... just Python and PyGame for me ;)

ch1ck3n (1629)

@LaneMartin this is made with javascript and HTML only

java is NOT javascript

sigh I hate it when people think java is javascsript

LaneMartin (87)

@ch1ck3n oh they different? sry

Whippingdot (573)

Hey why are you commenting on like every post ever made on replit. It is kinda irritating. Can you please stop? Kindly asking, you don't have to, but I got like a lot of pings cause of that. @LaneMartin

Whippingdot (573)

BTW i feel that gave a tone of angriness which I ashur u i didn't have @LaneMartin

LaneMartin (87)

AHEM, not to be mean but some of us like me actually like Codepen BETTER than this repl. And besides, this your opinion so whatever. rushes for a nap

Battledash2 (79)

@LegendaryWolf Hey! Wanna collaborate? Maybe you can help make a better IDE for https://betaide.repl.co/

This code seems pretty nice, maybe you wanna help us.

LegendaryWolf (701)

oh yeah! I wud wish to help you :) seems quite a big project of urs. and some of the JS is of @Coder100 too, so I wud take the help of him too lol. sorry for the late reply, I was not active on repl.it from a few days/weeks

Battledash2 (79)

All we need is support for folders. The usercontent page is broken but we can fix that. @Battledash2

LegendaryWolf (701)

bruh this is not a game, its a code editor like CodePen! ok but ty for saying its nice BTW

luke110206 (0)

I'm having problems using javascript

RohilPatel (1535)

Nice, ask them on repl ask! @luke110206

luke110206 (0)

@RohilPatel I'm having trouble running javascript on this repl not repl.it in general

Cosemus (12)

OH NVM IM SORRY DIDNT NOTICE SCROLL

Cosemus (12)

only shows code boxes for me nothing else please fix

BananaJellyfish (207)


also, what do these bits do?

LegendaryWolf (701)

no, 2nd one css and 3rd one is JS

LegendaryWolf (701)

no, 2nd one css and 3rd one is JS

LaneMartin (87)

@BananaJellyfish Looks like he couldn't handle the Neutron Style.

  • Jimmy Neutron
SilvermoonCat (430)

is theree a preview when you use it? pretty cool

LegendaryWolf (701)

Its like codepen if you have ever used it, there is no preview...
its a live code editor which runs code automatically...