How I created devchallenges.io in just 3 Months in my free time
Thu Nghiem
Posted on June 29, 2020
About me
Hi I am Thu. I am from Vietnam and I moved to Finland 5 years ago (all alone..). I came to study and I got my first job as a game programmer just after 1.5 year of self-studying. Later I got a job as a web developer in one of the biggest company in Finland - Telia. I am working as Developer/Scrum master in the team.
Now I am at the point where going to work everyday become a bit boring, so I decided to do something different. I started to make devchallenges.io after seeing people sharing their stories in dev.to and here is how I make it happen.
Roadmap
Week 1
I gathered inspirations from different sources for designing the website. Most of my time I spent on Dribbble, I picked several designs and I use the colors from them.
After few days, I had a rough idea of what I wanted to do. Then I used Figma - a free tool for design to draw quickly designs in just one weekend.
Week 2 - Week 3
I worked hard in these 2 weeks translating my idea to Code and I completed 75% of application - both frontend and backend
Week 4 - Week 8
The next step is to design challenges.
This is the most challenging part as I have to come up with the ideas and designs. But I manage to do 16 designs at the end by reading different articles and Dribbble :)
Week 9 - Week 12
The last step is to put everything together. There are time when I wanted to give up as I thought it's never going to complete.
There were many I have to redo because it does not make sense when it comes together. But a good thing is whenever I shared my work to my friends they all think that the designs looks goods and it moves me forward.
What I use
I use all the free stuffs here :)
Design:
Front-end:
- React - I use Create React App to start with
-
Hooks - with
useState
for local state anduseContext
for global state - CSS modules, CSS variables - To keep CSS organize
- Others: Typescript, react-hook-form, yup,..
Back-end:
- Firebase - I use for hosting, authenticate, database,.. everything it offers.
- Express - To create RESTful API
Automation:
- I use Google cloud to continuously build and deploy.
How I keep it look professional
When it come to design a website, I want it to look good. And there is no secret to it, as long I keep my spacing and color consistent, it will turn out well eventually.
By using CSS and Sass variables, I manage to do it with ease.
Because I make it look so clean, many of my friends keep asking if this is free. Yes it is free, I am not selling a damn thing there :)))
What next
I will continue work on devchallenges.io and make it better. I already see the first users and I hope there will be more.
I am planning to create a youtube channel where I share my stories and share my experience.
The end
So thank you for reading, I hope this will help you in your personal projects or somehow motivate people to do what I do. And if you want to improve your portfolio then checkout https://devchallenges.io/.
Feel free to leave me a comment.
Posted on June 29, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
July 23, 2024
June 10, 2024