DEV Community

loading...
Cover image for 8 Projects with modern designs to become a Full-stack Master 2020

8 Projects with modern designs to become a Full-stack Master 2020

nghiemthu profile image Thu Nghiem ・4 min read

Are you looking for projects to sharpen your skills? Are you stuck at coming up with new ideas?

As developers, we love to code, but sometimes it's hard to find designs or ideas to work on.

Hi, my name is Thu. You might hear from me in some previous posts. In the last months, I have been working on creating 8 real-life projects that include designs and requirements.

I have designed 8 distinct projects that help you to practice every skill needed to become a super-star developer.

With these projects, you can do to build an outstanding portfolio and become a Full-stack Master.

1. Image Uploader

Image Uploader

What you will practice

You will develop something that I am always afraid of. It is an Image Uploader application. You will learn how to upload a photo from the Front-end, how to store a file in the database and build a simple API.

Level

Front-end: ⭐⭐
Back-end: ⭐⭐⭐

2. My Unsplash

My Unsplash

What you will practice

You will learn to build the basic API functionality (like GET, POST, PUT, DELETE in RESTful API).

You will also learn how to make an image grid similar to Unsplash.

Level

Front-end: ⭐⭐⭐⭐
Back-end: ⭐⭐⭐⭐

3. CatWiki

CatWiki

What you will practice

Are you a cat lover? Using an external API to fetch the cat data, you will build an API that tracks user behavior. You will also get to practice how searching, filtering work in the backend.

The project will also test your Front-end skills with a layout full of cats 🙀

Level

Front-end: ⭐⭐⭐⭐
Back-end: ⭐⭐⭐⭐

4. Authentication App

Authentication App

What you will practice

Being a backend or full-stack developer, it's inevitable that you have to deal with user and authentication. In this project, you will learn and build a simple but powerful application to handle user authentication and user data.

This project will also be the foundation for the upcoming projects.

Level

Front-end: ⭐⭐
Back-end: ⭐⭐⭐⭐

5. Shoppingify

Shoppingify

What you will practice

I mean... building an e-shop application is a really huge task. But if you want to practice building one, Shoppingify is a good start. This project does not require any authentication but it has almost every function that an e-shop has. You will learn how to build a shopping cart, add new items, edit items, manage history/data,...

This project also test your Front-end skill at a high level, as you will create a complex and responsive layout

Level

Front-end: ⭐⭐⭐⭐⭐
Back-end: ⭐⭐⭐⭐

6. Chat Group

Alt Text

What you will practice

I had always wanted to build a chat application and I have done it and it was super fun. In this challenge, you will build a Multiple chat group application. You will learn about real-time databases, you might also get more familiar with technologies like websocket, socketio...

By integrating your authentication application, you will learn how to manage your users, add them to the group, handling messages,...

You will also build a simple but not so simple UI 😆

Level

Front-end: ⭐⭐⭐
Back-end: ⭐⭐⭐⭐

7. Tweeter - Twitter Clone

Tweeter - Twitter Clone

What you will practice

I love this UI, simple and sleek.

I am telling you, if you can re-create Twitter, you can do anything 😬.

In this project, you will create a profile similar to Facebook, Twitter. You will learn how to make "follower-following" system.

You will also learn how to post a new Tweet, add comments to them. How to filter different Tweet type,...

This is definitely one of the most challenging projects yet. But I promise you will learn a lot 😎

Level

Front-end: ⭐⭐⭐⭐⭐
Back-end: ⭐⭐⭐⭐⭐

8. Thullo - Trello Clone

Thullo - Trello Clone

What you will practice

I know... it's already the last challenge in this post. But I have to tell you. This project is damn challenging, even for me to design it 😅

You will learn thousands of things in this project, as there are millions of things going on:

You will learn how to create a team, project, card, list,... and at the same time, the user should be able to edit and delete them.

In the Front-end, you will create Drag and Drop functionality that will haunt you for some amount of time 😜

You will also create commenting, uploading, and other tricky functionalities.

There are even more to this project. But I'll let you find out 😋

Level

Front-end: ⭐⭐⭐⭐⭐
Back-end: ⭐⭐⭐⭐⭐

Conclusion

You can find all projects on DevChallenges.io. I really hope that these projects inspire you not only for developers but for designers. If you want to get more updates from me. Feel free to follow me and leave me a comment.

🐦 Thu Nghiem Twitter
🐦 Devchallenge.io Twitter
🔥 Devchallenges Website

Discussion (47)

pic
Editor guide
Collapse
hood profile image
Andrea Cappuccio

Gotta tell you, I'm loving the idea behind devchallenges.io! Keep up the great work!

Collapse
nghiemthu profile image
Thu Nghiem Author

Thank you so much!!

Collapse
demkantor profile image
demkantor

Never had a chance to say thank you for making this! I did a few of these challenges a couple months back and have been meaning to find time to take on the rest. Super cool you keep adding to this and for sure when I get some time I'll be taking these on!

Collapse
nghiemthu profile image
Thu Nghiem Author

Haha, I remember, I was about a month ago. I was having a lot of things going on, I didn't have much time to check it in detail.

Haha I have added many new features since last month, so check it out. I am not planning to stop btw :)

Collapse
iamrohitsawai profile image
Rohit Kiran Sawai

Don't you think you should have add some projects with complex Database and Backend system? I don't say, list you have proposed is not good. I say, why don't you make such list where complex Data Structures will be needed and will need lots of efforts in developing algorithms.

Collapse
nghiemthu profile image
Thu Nghiem Author

yeah it might be a good idea in the future. I want to focus more on being a full-stack dev. There are few super complex challenge already. If I make it too difficult. Less people would attempt it

Collapse
iamrohitsawai profile image
Rohit Kiran Sawai

Why don't you make categories in your article i.e. Projects for Beginners, Intermediate and Advanced Developers? In that people will understand where to look at.

Collapse
developerkaren profile image
Karen Efereyan

These are So nice. I'm.so excited about the unsplash project. Thanks Thu

Collapse
nghiemthu profile image
Thu Nghiem Author

You are welcome :)

Collapse
simonholdorf profile image
Simon Holdorf

You are putting a lot of effort into this, well done my friend!

Collapse
nghiemthu profile image
Thu Nghiem Author

OMG! Thank you so much, your post inspired me a lot

Collapse
amanhimself profile image
Aman Mittal

I love the fact that devchallenges.io exists! Thank you for making it available!!!

Collapse
ajeasmith profile image
AjeaS

Your amaaazing! Thank you for this :D

Collapse
efleurine profile image
Emmanuel

This website is a great resource. I will be using it to improve my UI skills.

Collapse
hnrq profile image
Henrique Ramos

Awesome! Will try to do Thullo, always wanted to create a drag and drop functionality

Collapse
nghiemthu profile image
Thu Nghiem Author

Wow I wish the best luck and a lot of fun with it. :) It will be challenging but fun

Collapse
osefdb profile image
Osef Alfan Fadhil

This is what I've been searching for. Thank you so much!!

Collapse
mvrs profile image
Marlon Johnson

I just checked out the site and I’m definitely gonna give these challenges a go. The designs are clean as well. Awesome job

Collapse
nghiemthu profile image
Thu Nghiem Author

Thank you! Looking forward to seeing your solutions

Collapse
andreasplahn profile image
AndreasPlahn

Absolutely great work! Thank you 👍

Collapse
nghiemthu profile image
Collapse
karm0s profile image
Karm0s • Edited

I think I just found how to occupy my nights for the next 2-3 months.
Thank you!

Collapse
nghiemthu profile image
Thu Nghiem Author

haha welcome and stay longer if you wish :)

Collapse
dailydevtips1 profile image
Chris Bongers

That is so cool, awesome website Thu, love to see sites like this for inspiration 🔥

Collapse
nghiemthu profile image
Thu Nghiem Author

Thank you Chris

Collapse
hunterjsbit profile image
Son Goku

Awesome website, also designs are HQ

Collapse
amirdarx profile image
amir

I really needed sth like that and thank you for sharing this

Collapse
pulpfuture profile image
Adam Shockley

Cool idea.

Collapse
mkubdev profile image
Kubdev

I don't understand the goal of making a free app, without any ressources given (instead of assets) ?

Collapse
nghiemthu profile image
Thu Nghiem Author

I don't understand your question. What do you mean?

Collapse
mkubdev profile image
Kubdev

I just shared your website to a friend who actually learning frontend dev, and he was a little bit confused since there is no advice, tutorial, etc... any way to learn!

But i just understand devchallenges is a dev gamification platform. No way to learn anything here ^^

Nice work and nice project, keep it up !

Thread Thread
nghiemthu profile image
Thu Nghiem Author • Edited

Oh as I am doing it alone, It's sometimes to hard to find time and motivation to create tutorials or write more blogs. I will definitely try my absolute best to explain more, share my experiences, write more blogs/tutorials... to my users/students. Devchallenges is only 2 months old, so if you can enjoy what it offers now, I am sure there will be way more things in the future :)

Collapse
dayesouza profile image
Day Souza

First time hearing about devchallenges.io! Loved it, thank you so much for the idea!

Collapse
nghiemthu profile image
Thu Nghiem Author

Hix I need to try harder to share this to everyone.. thank you so much btw, Don't hesitate to share it with your friend

Collapse
bibhashthakur profile image
Bibhash Thakur

This looks amazing! Will definitely give this a go once I finish FreeCodeCamp.

Collapse
femiade profile image
Femi Adebayo

Great read. Thank you for this!

Collapse
nghiemthu profile image
Thu Nghiem Author

You are welcome

Collapse
ibtsamilahi09 profile image
Ibtasam Hassan

danm!! this is what I was looking for. Thanks, Thu Nghiem

Collapse
nghiemthu profile image
Thu Nghiem Author

danm!! you are welcomed

Collapse
nk2303 profile image
Ngan Kim Khong

Oh this is a great blog! I'm thinking of doing the same thing :) !

Collapse
nghiemthu profile image
Collapse
titanrintu profile image
Satya Biswal

Thanks for listing these. I want to switch to web from Windows app development. I believe this projects will make things easy.

Collapse
nghiemthu profile image
Thu Nghiem Author

Yeah I believe so too. Good luck and see you around at devchallenges

Collapse
muinv profile image
mui-nv

bai cua anh duoc dich, va dang la hot trend cua thang nay :D
qiita.com/kanye__east/items/77a974...

Collapse
nghiemthu profile image
Thu Nghiem Author

Yeah minh biet, the author asked the permission :)