Skip to content
Sign UpLog In
This post is read-only. Explore Repls and connect with other creators on Community.View Community
The info in this post might be out of date, check out our docs instead. View docs
49

HTML, CSS, JS Editor App | Jax - Very similar to replit

RYANTADIPARTHI
RYANTADIPARTHI

HTML, CSS, JS Editor App | Jax - very similar to replit

Before I start, I want to remind you to always open this in a new tab.

canvas

click that button circled in red ^^

If you click that, everything will work properly with no problems. Don't try to check out the website in the console window. It won't work.

Alright, now we can start.


I made a fully functioning HTML, CSS, JS Editor App. It took me a very long time to make. This app is very similar to replit, and has almost all the features of replit.

It even has the same design as replit.

Features

There are way to many features for me to list out, but i will give an overview.

you will see this icon on the left side of the navbar on top, once you register and login.

Screenshot 2021-07-29 6.48.48 AM

click on it, and you see a list of options, just like replit. If you know how to use replit, you basically know how to use Jax (the name of this site).

next on the navbar (top). You will see, just like replit all the options available. Use them just like you use replit.

when you click the sidebar option, in the image above, you will see your username too. And beside are your notifications. Click on your username to show a dropdown.

You can click on those options accordingly... just like replit.

I don't need to give any more features, cause just like i said:

if you know how to use replit, then you know how to use Jax.

it has the same things:

  • talk section
  • templates
  • etc....

Few Notices

Some things are different from replit.

  • When you search up stuff in any search bars, always remember to hit enter to get results.
  • when you want to find about a person's profile. Try clicking on their name. It takes you to their profile. You can also hover over their username, but you can only do that in the talk section.

Detectors

There are three detectors in this website. The detectors are for posts. When you add a post to this site, you must pass three detectors:

  • gibberish
  • profanity
  • duplicate

If you're trying tp spam or post useless posts, this detector will not allow you, and will stop you.

If you try to curse and use bad words, the profanity detector will detect it.

Finally, if you try to post a duplicate of another's post, this detector doesn't allow you.

If you think any of these detectors are wrong, and stopped you without you doing anything, please tell me. I will fix it.

Another thing is, if you want to see the spotlight version of your own jaxes, just go to the talk section or something and click on your username. It will take you to the profile page, and you can click any jax from there. It will show your spotlight page.

If other users want to check our other user's spotlight jaxes, it's normal. Just like replit. Click on a user's username to see their repls. Same as replit.

One more thing is, in Jax (name of this site), the Share section and Tutorial section are in the same tab. They will, of course have different badges, but are in the same sections.

I thought that since both share and tutorials are about showing creativity and all, I thought to just group them.

So when you create a tutorial or share post, you will see a box below. Click it if you want to post a tutorial. If you want a share post, then don't click it.

Screenshot 2021-07-30 11.12.56 AM

So if you want to check out share section or tutorials, just remember that they are in the same section. The badges show if it's a share or tutorial.

When you want to use JS or CSS, use <script> and <style> tags.

If I remember anything else, I will add it here.

Instructions

If you know how to use replit, you know how to use Jax (the name of this site)

So not many extra instructions for Jax.

If you don't know how to navigate, or if you're have difficulties, please comment to me, and I will help you.

Markdown and mentioning

Here's the link for the full Jax tutorial of markdown. I made a tutorials post in Jax, just like Replit.

Markdown Tutorial (Jax)

You can use markdown in Jax too. use them in the talk section. posts, or coments, replies. Whatever. There are just a few differences.

  1. When you want to use strikethrough in Jax, use <s>text</s> or <del>text</del>
  2. links only work when you do: [NAME OF LINK](URL). If you just do LINK, it doesn't work.
  3. when you post images, do: ![NAME OF IMAGE](URL). If you just do URL, it doesn't work.

I think those are the only differences in markdown.

EXTRA: You can also do mentioning in Jax. Same format.

@username

Only thing is, you must mention users only in the beginning of your comment, reply or description or etc or at the **end ** of your coment, reply or description or etc.

just a reminder: Everything else in markdown is the same as Replit. You can even use code blocks.

Moderators

You can find out if a user is a moderator or not by looking at their username.

✪ - This badge indicates that the user is a moderator.

⍟ - This badge indicates that the user is an admin.

You will also see a list in the talk section. The list is on the right side. It shows all the staff members. (mods and admins). You can also click on usernames to go to their profile, and check the badges. Like replit.

I will be picking moderators, based on their actions on Jax. If they seem responsible or whatnot, i will select them accordingly.

Moderators have a lot of extra privileges.

If you were selected a moderator, you will see an extra section on the navbar.

Screenshot 2021-07-29 7.21.39 AM

You can click on the mod controls dropdown, and you will see a list of options:

  • all reports
    • in this, you can just see the user's reports and resolve them by going to wherever they are.
  • all user's data
    • for this, it's a bit complicated, so there's a separate instructions page for you in there. Read it, and you will get it.
  • bug reports
    • you can check out user's reports of bugs. If you can fix it, please do, or if you can't, let me know and i will fix it.
  • staff chat
    • this is where mods and admin (me) will chat, and discuss about some stuff. Go to your home page. You will see more info about this there.
  • deletion requests
    • if a user wants to delete their account, they will have to request it. You have the option to delete or not. But first, you must discuss with me.

There's more functionality for mods. You will soon find out with a bit of exploring, and discussion in the staff chat.

Moderator must do their tasks efficiently as the replit mods. More will be discussed in the chat.

Banning

Any user who violates the rules will be banned. This includes:

  • spamming
  • cursing
  • duplicating
  • trying to hack the site
  • Any other things you think is not right too.

Any of the above, including any new ones, or anything that seems bad, please do not do. Or you will get banned

Credits

Thanks to these people:

@Coder100
,
@SixBeeps
,
@Bookie
,
@ch1ck3n
, and
@OldWizard209
.

@Coder100
- for helping me by giving a few SVGS like the marking answers SVG and some others.

@SixBeeps
- for more SVGS

@Bookie0
- For options on color pickers

@ch1ck3n
- For some other SVGS, and a little bit of help with markdown (even though I didn't use it, and it didn't work)

@OldWizard209
- For markdown too (even though this didn't work either and i didn't use it).

Pinging

@Whippingdot
wanted me to ping him when I post this.

Suggestions and more

If any of you have any suggestions or feedback, please let me know.

Also, please let me know if you have any problems with the website. I'm pretty sure there are some, since it's a very big site, and took a lot to code this.

Just let me know if you have any concerns.

Enjoy!

1 year ago
You are viewing a single comment. View All
1
1
RYANTADIPARTHI
RYANTADIPARTHI

@Korbindev
uhh thanks! But what do you mean by guys? I'm the only one who did everything. I collaborated with no one. And what do you mean make yourself mod on your own site?

Please explain your comment in more depth.

1 year ago
1
Korbindev
Korbindev

oh sorry I was trying to make something similar to this but i want to know how you did it I was also wondering if you could help me make a django sm app and I need a [email protected]

1 year ago
1
RYANTADIPARTHI
RYANTADIPARTHI

@Korbindev
oh. So you want me to be a mod for your app which is similar to mine right? Well, if that is right, then sorry, but I can't really help you, because I'm busy right now making something else... So maybe sometime later...

1 year ago