21
Deploy Your First Application in Glitch.
Glitch is one of free platform, that can help you make your application online. Glitch give us 1000 hour per month, more than we need more for deploy one application.
For this tutorial, we will make a simple counter application.
All required module:
- Filesystem (fs)
- Web server (http)
Note: Make sure you have installen fs
module. If you don't have it installed, you can install by run this command:
npm install fs
Make a file named index.js
, and fill with this code:
// Adding required module
const http = require('http');
const fs = require('fs');
// For development, use 4040
const port = 4040
// Set limit
const limit = 10
// Run server
server = http.createServer(function (req, res) {
fs.readFile('counter.txt', 'utf8', function (err,data) {
if (err) {
return console.log(err);
}
// Check if page view(s) is less than limit
if (limit > parseInt(data)) {
// If the page view(s) is less than limit
res.end(`Hey, this page view(s) is ${data}! Can this page reach ${limit} views?`);
} else {
// If the page view(s) is more or same than limit
res.end(`Hey, this page view(s) is ${data}! Yay, the page views is reach ${limit}!`);
}
// Add +1 to the counter file
fs.writeFile('counter.txt', parseInt(data) + 1, 'utf8', function (err) {
if (err) return console.log(err);
});
});
}).listen(port)
Create also the file that named counter.txt
. You can fill it with 0
, or any number that you like.
Finnaly, let's run our app. Type this command:
node index.js
Then, fire up your browser (you have fire up it, LOL), then open http://localhost:4040.
Coding, check.
At first, you need to register and create an account at Glitch, after that, open your dashboard and create a new project (select glitch-hello-node
option). You can delete all the files, except package.json
and .env
. It's ok if you wan't to keep the file to.
After that, back to the editor, we need to modify the port, so our script can work with Glitch.
Modify port
variable value (line 7) to this:
process.env.PORT
So, the 7th line will look like this:
const port = process.env.PORT
Save the changes, upload the index.js
and counter.txt
to your Glitch project. The file structure will looks like this:
We need to edit the package.json
file. Maybe this is the hardest part from this tutorial. So, be careful. At first, we need to change the script, with our index.js
file. Replace "start": "node server.js"
with "start": "node index.js"
. After that, we need to add some module that we need. You can add it by simply click "Add package" button
After clicking, a form will appear. Click the input with "search npm for packages" text, and type "express".
Click the first result. Do the same way, and add the fs
package.
Select the second one, and we done. You can see the result by press the refresh button (the second button from left).
That is our project today. Hope you enjoy the project. Bye!
21