-
Notifications
You must be signed in to change notification settings - Fork 341
URL Shortener Microservice
Created by Rafase282
Github | FreeCodeCamp | CodePen | LinkedIn | Medium Website | E-Mail
Build a full stack JavaScript app that successfully reverse-engineers this: https://shurli.herokuapp.com/ and deploy it to Heroku.
Note that for each Basejump, you should create a new GitHub repository and a new Heroku project. If you can't remember how to do this, revisit https://www.freecodecamp.org/challenges/get-set-for-our-api-development-projects.
As you build your app, you should frequently commit changes to your codebase. You can do this by running git commit -am "your commit message"
. Note that you should replace "your commit message" with a brief summary of the changes you made to your code.
You can push these new commits to GitHub by running git push origin master
, and to Heroku by running grunt --force && grunt buildcontrol:heroku
.
- I can pass a URL as a parameter and I will receive a shortened URL in the JSON response.
- If I pass an invalid URL that doesn't follow the valid http://www.example.com format, the JSON response will contain an error instead.
- When I visit that shortened URL, it will redirect me to my original link.
While heroku can use them as is, cloud9 needs extra work to get them from the .env
file that you would create.
There were quite a few things that I learned from this, first, everyone prefers to use Mongoose over plain MongoDB. Second, I need to create a collection or scheme if I use Mongoose.
This will do with plain MongoDB.
db.createCollection("sites", {
capped: true,
size: 5242880,
max: 5000
});
Since I used MongoLab and I did not want to provide the url with username and password embedded to the whole wide word, something that everyone will want to avoid in production, I opted for using custom environment variables like process.env.MONGOLAB_URI
For this to actually work on c9, not necessarily heroku I had to use
require('dotenv').config({
silent: true
});
Otherwise it would not work. I have provided a link to learn more about it.
As for html and modifications on the fly, it is better to use jade
so that is something I will be learning too. npm install jade -S
will get you started.
You will then use render instead of sending a html file on the custom router like this:
res.render('index', {
err: "Error: You need to add a proper url"
});
which will be handled by:
if (err)
div
h2(style = "color: red;")= err
on the jade file.
As for node and mongo, they work async
which is something that skipped my mind while trying to return the results from a findone
search.
Speaking of which, doing a find
didn't yield the results I wanted so I opted for findone
instead. Knowing this will save you much time and trouble.
Also you will have to pass the db as a parameter or you will have to connect and close each time.
- From the server files:
api(app, db);
- From the API:
module.exports = function(app, db) {
- From local functions:
function save(obj, db) {
There are different ways to handle the url with the api:
-
app.route('/:url')
to get the short url to redirect. -
app.get('/new/:url*', handlePost);
to handle a request to encode the url afternew
even though new is not a real directory. -
app.route('/')
to display the main html file on root. -
app.route('/new')
for handling errors to the user about bad usage, it should be used with an url to be encoded.
Thanks for visiting, if you like this please feel free to star my repo, follow me or even contact me about contributing as it will be a lot of work and having help would be cool.
- HTML5 and CSS
- Responsive Design with Bootstrap
- Gear up for Success
- jQuery
- Basic JavaScript
- Object Oriented and Functional Programming
- Basic Algorithm Scripting
- Basic Front End Development Projects
- Intermediate Algorithm Scripting
- JSON APIs and Ajax
- Intermediate Front End Development Projects
- Claim Your Front End Development Certificate
- Upper Intermediate Algorithm Scripting
- Automated Testing and Debugging
- Advanced Algorithm Scripting
- AngularJS (Legacy Material)
- Git
- Node.js and Express.js
- MongoDB
- API Projects
- Dynamic Web Applications
- Claim Your Back End Development Certificate
- Greefield Nonprofit Project 1
- Greefield Nonprofit Project 2
- Legacy Nonprofit Project 1
- Legacy Nonprofit Project 2
- Claim your Full Stack Development Certification
- Whiteboard Coding Interview Training
- Critical Thinking Interview Training
- Mock Interview 1
- Mock Interview 2
- Mock Interview 3