Everyone knows that project-based learning is best. Endless ‘diving-in’ tutorials might be good initially but if you can’t build a project all by yourself, you have not learned much. Real learning requires practice and whether you want to improve your skills or build a portfolio to get a programming job, the best way to practice is to build projects. Now, what projects you should build is another good question that I will try to answer in this article. While there’s no universal answer to what kind of projects one should build when learning to code, there are definitely some good project categories and ideas that we are going to discuss in this article. These projects will help you upskill yourself and create a portfolio of projects as a web developer or mobile app developer that you can show to your future employers in interviews. So without further ado, let’s get started: Content Overview Web portfolio projects Landing page API-powered website Clone website CRUD application AI-powered website Full stack  unique project Mobile app portfolio projects Ecommerce app Diet tracking app Personal finance app Movie review app Photo editing app Social networking app Wrapping up Web portfolio projects 1. Landing page All great products on the internet have their own landing page. As a web developer, knowing how to build great landing pages is the most basic thing. This would require you to know how to build responsive websites and websites that have good design. Landing pages are static so even if you just know and , you can come up with beautiful landing pages that demonstrate the product best. You can browse on Frontend Mentor for landing page ideas. HTML CSS 2. API powered website Most projects consume some API and if you are serious about building a career as a programmer, you must know how to consume APIs to build better projects. There are endless ideas that you can make real with APIs. From fun Pokémon projects to Music streaming apps to AI projects(which will be discussed later in the article), your creativity is the only limit to what you can build. 3. Clone website A Clone website could be a copy of any popular websites out there or the ones that you like and use the most. It could be anything like Facebook, , , , , etc., or even the not-so-popular ones given that they are somewhat complex to build. YouTube Instagram Twitter Amazon If you can create a clone of such websites, it demonstrates that you can convert good designs into good code. Find what website you want to clone and start building. If you want to take it a step further, create a full-stack clone application with a frontend, API, and database. 4. CRUD application Most websites have CRUD functionality enabled. CRUD operations allow users to create, read, update, and delete data. Blogs, e-commerce, social media, educational platforms, productivity apps, etc. all have some sort of CRUD functionality enabled. There are lots of good project ideas under this category like a TO-DO list, Notes App, Chat App, E-Commerce, Social Media website, etc. that you can build. 5. AI-powered website AI is booming in 2023 and the best part is that you don’t necessarily need advanced artificial intelligence knowledge to build AI projects. You can build something great on top of great AI APIs available on the internet like Open AI API etc. Having an AI project in your portfolio is a great step to show your employers that you care about the latest technological developments and can make your way to learning the required skills. 6. Full Stack unique project This is the sum total of all points we have discussed above. You have built landing pages, API-powered web apps, Clone web apps, CRUD apps, and maybe AI-powered web apps. Now, you have to combine all this and build a unique project. Here you will create a fully functional full-stack project along with a separate landing page. If you can also add AI to it, that would be an extra bonus. This project should ideally be something you can relate to, an idea you find interesting, or a solution to a problem that you are facing. Once you have finalized the idea, brainstorm and document all the features that you want to add to the web app. Now, you should start the building process, there are three steps to it: Create all the API endpoints you need and check if the data is getting saved properly in the database or not. Frontend: This is where all the users of your web app will land. So try to build the app with good UI/UX that users would love to use. API endpoints: The landing page doesn’t add anything to your product but it’s for the people who will come to use your project. So make sure, you spend a good time on it. If you can build a big project like this nicely, it would serve as the best certification of your skills. Landing Page: Mobile portfolio projects We have already discussed web projects and most of those project ideas can also be used in the context of apps like building a clone app, CRUD app, AI app, etc. But for this section, we are going to discuss specific project examples so that after you finish reading this article, you will have both specific ideas and broad categories that you can fit your projects under. 1. ECommerce app ECommerce is rocking both on the web and mobile and we can’t ignore the massive size of this industry. Knowing how to build and maintain e-commerce apps is going to help you a lot as a mobile app developer. To begin with, you can either clone an existing e-commerce app like Amazon, etc or you can build your own from scratch. Irrespective of what you choose, let’s see some key features that you must add to your app: Search for a product Add to cart and checkout Add your own products Past purchases Rate and review products 2. Diet tracker app Diet Tracker app is an app with lots of potential. You can start this as a simple food logging app and eventually slowly make it bigger and better. Let’s see some features that you can add to this app, sooner or later: Food logging Find nutrients by searching the name of a recipe Diet plan for specific fitness goals Weight tracking Water reminder Progress tracking 3. Personal finance app Managing finances is a gruesome task and what’s a better way to simplify it than with an app? Let’s discuss some features this app could have: Record income and expenses Different categories for income and expenses Can give tags to a transaction Budget planning Charts and graphs to view the cash flow, income, and expenses Can automate monthly income and fixed expenses Track your investments While there’s no end to what you can add to this app, even if you implement the above features, that would make this app a solid project in your portfolio. 4. Movie review app Apps like IMDb are really popular and fun to build. You have to create a similar app in this section and make sure that you definitely add the following features to it: Search for a movie Rate a movie Write review Read existing reviews Follow tags for various genres Read the description, cast, release date, budget, collection, etc. While these features would be interesting to implement, don’t forget to differentiate yourself wherever you can. For instance, you can create a niche movie app like Sci-Fi, Comedy, Action, etc. 5. Photo editing app Unlike other apps mentioned in this section, the Photo editing app is a little different and it will help to diversify the project categories in your portfolio. So, let’s see some features that you can add to the project: Enhancement options like contrast, brightness, etc. Create a collage Add borders and frames Filters like Grayscale, Lighten, Darken, etc. Reduce file size Remove background AI enhancement 6. Social networking app Social Networking apps are everyone’s favorite and have a bright future. Building one such project will give your skills and portfolio great improvement and help you shine in front of your employer. Let’s see some features that you can add to your app: Create posts with text and images Comment on other people’s posts Like/Upvote and Bookmark posts Follow other people based on interests Personalized feed AI-generated posts and images The AI-generated posts and images are just an additional feature to spark up things that you can consider adding while the rest of the features are basic and you must add them to your project. Wrapping up That’s it. I hope you are filled with endless ideas for your upcoming projects. You have both idea categories and specific examples that you can build whether you are a web developer, mobile app developer or both. Make sure to spend good time on the user interface and user experience of these projects as they should be good enough to be used by real user. Moreso, a great design and user experience is the key to acquiring more users to your projects/apps. I hope you enjoyed this article, let me know which project are you going to choose to start your journey. Good luck! Also published here.

The is an opinion piece based on the author’s POV and does not necessarily reflect the views of HackerNoon.

6 Tailwind CSS Productivity Hacks Every Developer Should Know

20 Essential Backend Tools For Developers

Get In Touch With Me

2021 - HackerNoon Contributor of the Year - SIDE-PROJECT

Nominated for 2022 - HackerNoon Contributor of the Year - Programming

Nominated for 2022 - HackerNoon Contributor of the Year - Website Development

Nominated for 2022 - Software Developer of the Year

Nominated for 2022 - HackerNoon Contributor of the Year - Javascript

Nominated for 2022 - HackerNoon Contributor of the Year - Beginners Guide

Nominated for Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Open Source

Too Long; Didn't Read

12 Project Ideas for Aspiring Web and Mobile Developers

12 Project Ideas for Aspiring Web and Mobile Developers

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

10 Reasons To Use TailwindCSS In Your Next Project

10 Top Industries To Be Transformed By Artificial Intelligence, Soon

10 Essential Mobile App UI Design Principles for Building Outstanding Apps

11 AI & ML App Ideas For Startups and SME’s In 2019

11 Best Low-Code And No-Code Platforms in 2021

10 Reasons To Use TailwindCSS In Your Next Project

10 Top Industries To Be Transformed By Artificial Intelligence, Soon

10 Essential Mobile App UI Design Principles for Building Outstanding Apps

11 AI & ML App Ideas For Startups and SME’s In 2019

11 Best Low-Code And No-Code Platforms in 2021

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps