How to Setup and Use the Repl.

it

In this course, all programming assignments are based on JavaScript with using an API such as
OpenGL or WebGL. Avoiding limitation of having an advanced personal computer, students can use
“Repl.it” as an online IDE for development their projects. Click here to access the Replit website.
You can also type https://replit.com/ into a web browser.

Before anything, you need to create a free account via the “Sign up” button at Replit homepage,
this will allow you to save and share your works. Then, for your next attempt you can easily access
your account via the “Log in” button. You can use Replit as a guest user or as a registered user. It is
recommended that you register and create an account. This will also allow you to generate a URL
to your assignment to post as your assignment submission. If you do not register, you must
download your work every time, or you will lose it. If you want to download your work, you must
copy and paste the file's contents back into the Replit IDE to continue working on your assignment.

As you progress through this tutorial, pay attention to the yellow boxes and the red arrows. This is
where you will find instructions on setting up and using Replit.

1. The first step is to specify your working language. Our working language is JavaScript. Click on
HTML, CSS, JS as shown in this image. JavaScript is represented as JS.
2. Then you need to enter your program’s title in given box and press “Create Repl” button.

3. Now you are at the Replit main page. Notice this window includes a text editor where you will enter
code (left side). It also includes a view space (right side) where the visual output shows once the code
executes. One way of debugging is to write code one step at a time and run it. You can see the impact
or result of your changes immediately in the view space.

You must become familiar with the features and operations of the Replit development environment.
Take a moment to review the information in the yellow boxes.
4. To share your program and submit your assignment, click on your program name (In this example,
“Programing Assignment Unit 1”) as shown in the image above, and then click on “Publish” button.

Then you need to enter a description for your repl post, including a cover image as well. And then click
the “Publish” button.

You will receive the confirmation box. To see your repl post, click the “Spotlight” button.
Click on the “Run” button for running your program. You can then get access to the source code of
your work by clicking on the “Show files” button. Finally, copy and paste this page’s URL into the
assignment submission area. This procedure is necessary when completing and submitting your
assignments.