Hello people, this is my first post. I want to share a personal project and the roadmap (list of tools, languages or technologies) that I used to complete it.
The project is makeresume.co. There are a lot of similar projects with better qualities and features, but I was looking for the opportunity to learn and/or refresh some technologies, so, that wasn't a problem for me.
The idea of this project was to learn/refresh some new technologies because I am currently working with some old ones (ColdFusion and AngularJS).
So, some time ago I used resume.io and for me, that app is beautiful and I love it. "I can do something similar", I said.
Intro:
- I worked between 45 and 50 days (in my free time).
- The resume is generated using something similar to jsonresume.org but with a few updates.
- The UI is like a copy (poor quality) of the resume.io.
- Before starting the project, I watched some videos on YouTube to identify the best way to structure the code in the API (node.js) and also, I did a 5 hours duration free course to learn the basics about react.js.
Roadmap:
API
There is nothing strange here, a basic node.js project.
- node.js - https://nodejs.org
- express - https://expressjs.com
- mongoose - https://mongoosejs.com
- handlebars - https://handlebarsjs.com
- puppeteer - https://pptr.dev
- nanoid - https://www.npmjs.com/package/nanoid
- dayjs - https://day.js.org
- PM2 - https://pm2.keymetrics.io
The API receives a json with the resume's data and it is processed with some services generating an HTML file (Handlebars) and then, generating a PDF (Puppeteer and Chrome).
APP
I tried to create most of the components and my idea is to create a repo with them and share it.
- react.js using create-react-app - https://create-react-app.dev/docs/getting-started
- react router dom - https://reactrouter.com/web/guides/quick-start
- axios - https://www.npmjs.com/package/axios
- fontawesome - https://fontawesome.com
- flexbox - https://css-tricks.com/snippets/css/a-guide-to-flexbox
- react draft wysiwyg - https://www.npmjs.com/package/react-draft-wysiwyg
- smooth scrollbar - https://idiotwu.github.io/smooth-scrollbar
- react tooltip - https://wwayne.github.io/react-tooltip
- react device detect - https://www.npmjs.com/package/react-device-detect
Deploy
AWS - I am currently studying to get the AWS Practitioner Certification and the best way to learn something is using it.
The landing page and the UI are in S3 buckets with a CloudFront. I am using CloudFront because I wanted to implement an SSL certificate.
Domain and sub-domains with Route 53.
The API runs with PM2 in an EC2 instance (Linux) with a Load Balancer (to use SSL).
The database is hosted on MongoDB Atlas.
And that is all at this moment, I will continue working to improve the application and learning new things.
I made my resume with the app: https://s.makeresume.co/4AQzSi8lCV
Thanks for reading this article!
Top comments (2)
Hey Maximiliano, I like your idea of creating a resume website.
I've been thinking of same thing for some time now :)
Do you have a github repo for this work, that you're willing to share?
I'm interested mostly in the AWS piece. I'd like to 'Terraform' that part :)
all the best,
Hi, I will create some GitHub repositories to share part of the app. The part of the AWS, I am updating manually.