Hi guys, I am Shanjai Raj, a Self-taught Frontend Developer and UI/UX Designer from Sri Lanka working on side projects during my free time and sharing my experience and what I have learned, on platforms like YouTube and Twitter and here (Hashnode) 🥳
Like many Self-taught devs, I have worked on many side projects using various Frontend Technologies, in order to better understand the technology or the programming language. Here I would like to share some of the Frontend Projects that I have worked on, which I think would help you improve your frontend skills as well.
Real Estate App
Features you can include in the App:
- View all Properties
- View each property
- Search properties and add filter/sort functionality
Generally, you would need not need to include all these features in the process of building an app for learning more. But, you can include basic features like getting data from an external API and (assuming it is data related to Real estate) you can show the properties and once clicked, show the property and also add a Search functionality.
If you like to get some inspiration for some features and design knowledge, you can check out these websites: Realtor.com Trulia.com Zillow.com
[You can find more from this awesome article 🙌]
Github Finder App
This is a very useful project that a lot of developers have built. It uses the Github API to get the data and display the data on the Frontend.
Check out the Github API Docs
This would help you learn about dealing with REST APIs and handling it in the frontend. You could also create a search functionality and show the users from GitHub based on the search.
This is the Project that I built: react-github-api-app.netlify.app
Blog App
A Blog is also related to building the Real estate app but with some more features like having CRUD Functionality (Create, Read, Update and Delete).
Features you can include:
- Sign up and sign in as a user
- Show all blog posts
- Search blog posts based on keywords
- Store the data that you are handling (User data, Blogs data that you get from the API)
You can take a look at the project I have built: react-redux-googlelogin-blogapp.netlify.app
Technologies that you can learn from building these projects
- React (or any other Javascript framework)
- Tailwind CSS (CSS Framework)
- Redux (State management)
- ...you can also choose to use any other technologies/frameworks to use if you think it is useful to learn
By building these projects, you can get very skilled in Frontend technologies and start building side projects on your own. Also importantly, these are not the only projects that you can work on, you can explore other interests and build projects in that area as well.
Build as many projects as you can, which will not only (but mainly) give you a lot of projects to show on your portfolio, but improve your skills in doing projects on your own.
If you need any help, you can definitely contact me here:
Twitter: @shanjai_raj
LinkedIn: LinkedIn
I also make YouTube videos on these topics, so if this interests you, you can Subscribe to my channel and turn on notifications(🔔) to stay updated.
Thanks a lot for reading this article, if you did learn anything from this, I would appreciate it if you could leave a like, or if you have any questions or comments, please leave it in the comments and I would be very happy to help you out 👍