Glitch
We use Glitch as our online code editor. Glitch has some great features and makes coding and collaboration simple. And it's free for everyone.
Last updated
Was this helpful?
We use Glitch as our online code editor. Glitch has some great features and makes coding and collaboration simple. And it's free for everyone.
Last updated
Was this helpful?
You are signed up for a free Glitch account.
You are familiar with Glitch as our Integrated Development Environment (IDE).
Click the link below to sign up for a free Glitch account. Glitch runs in the web browser, which means you don't have to install anything. You can sign up for free using your university's email address. Or you can use an existing Facebook or Google account. It's up to you:
Glitch is all you need to get coding with HTML, CSS and JavaScript. It is the only code editor we'll be using throughout this course.
You manage your code in Glitch in so-called projects. A project could be a personal website you are creating from scratch, or a web app you are building in this course. A project contains a set of files organized in folders, just as you know it from the files on your computer.
Depending on the app you're building, you choose one of the four general types of projects available in Glitch. The glitch-hello-webpage is a simple website project with a web server to serve static websites. This means that the files you create (HTML, CSS, JavaScript) are served to the user as they are. There is nothing happening before serving the website, like querying a database and putting together dynamic content.
To make a dynamic website, we need a web server with a scripting language and/or a database. Such scripting languages run on the server and preprocess a website before it is served to the user. Preprocessing can mean different things: put in the current date, show the user's avatar when logged in, read current news articles from a database and put the teasers on the front-page, and much more. Languages like PHP, Python or Node.js are typically used as scripting languages on web servers. The glitch-hello-express template comes with a Node.js server installed, ready to preprocess our website templates.
The two other options glitch-hello-react and glitch-hello-eleventy are two templates introduced in 2021 to get started with the popular UI framework and the static website generator . I won't explain the details here, but both are interesting templates too if you are planning to create more advanced websites.
There is a fifth option, Import from GitHub, and this is the one we'll be using. Importing a project from GitHub pulls all files from that repository into your Glitch account and creates a new project from it. For this course, I provide you with an that I host on GitHub and that you can pull into your Glitch account whenever you want to start a new web app. We'll explore this template next.
