This article was originally published in my blog: codebymedu.com/blog/19-next-js-project-ideas-for-portfolio
Whether you’re looking for freelance projects, or a job, or just want to enjoy engineering it’s super important to have projects you can show to your clients or recruiters. But what to really build? There are so many ideas out there And here are some of the ideas I always wanted to build myself including a bonus tip on how to choose the best one for you and your image.
Before we start, these are not just portfolio ideas, you can actually publish them and try to make users and even make money from them. If you create useful products, that is the best way to impress anyone you’re trying to work with.
These ideas can also be written as full stack applications only with Next.js 14 and Supabase or similar for database. I’d suggest making them fully functional, as its more impressive.
As for the design, I’ve only included examples here, but I strongly suggest you try to be creative as much as possible, look at designs on dribbble or similar sites, think what is a good UX, etc. These are very useful skills as a frontend engineer even if directly you won’t create design yourself it will help you build better products in the future.
AI Projects
First, since AI is booming, we must take a look at some ideas to use AI. I’d strongly suggest you have at least 1 AI product in your portfolio, even if its small. Humans love shiny objects, and your visitors will be impressed by you staying up to date with the world.
1. Form Builder with AI
Idea: Create a simple form builder and make it possible for users to give 1–2 sentences and gpt would create a form structure for them.
Examples: tally.so (without AI) or typeform.
2. Survey Builder with AI
Idea: Same as above, this is also a builder but now for surveys. Allow users to give 1–2 sentences about their product, and it would generate a survey with questions, etc.
Examples: formaloo.com/survey-maker
3. Email Marketing Platform with AI
Idea: Create a platform to help people with email marketing, but with the help of AI. Example create email templates, use AI to fill these templates based on user input, schedule emails, etc.. You can use Resend or similar to send the email.
Examples: Mailchimp
4. Day Organizer
Idea: Example user would type what he want to do for the day, and AI would generate a structure for the day, in the UI the user can make changes, regenerate the structure, and so on. You can even go further and make email/calendar integrations, mobile app, etc.
Examples: UseMotion
5. Code Review Tool with AI
Idea: Build a page where you can paste code, and gpt would review it and suggest for suggestions. If you want to make it more complex, you can accept multiple files, or even repositories, integrations, etc.
Examples: CodeRabbit
Saas Projects
Saas projects are a great idea to have in your portfolio, first they’re inovative, and second they’re pretty complex to build alone both technically and as a product, and usually very scalable, meaning you can make it as complex as you want. Lets look at some of the ideas, however I suggest you go and check in producthunt or similar places for even more ideas.
6. Invoice Generator
Idea: Create a product where companies can manage their invoices, generate new ones for their clients, send them to the clients, and so on. Because many companies have the problem that invoicing is done manually, it takes a lot of unnecessary resources from them, if you create a Saas that will reduce their time, you’ll even be able to find real clients.
Examples: Stripe invoices
7. Online Booking System
Idea: Small businesses need a way to manage the appointments with their clients, schedule them, and so on. You can create a Saas that allows anyone to use it and it would solve the mentioned problems.
Examples: SimplyBook.me
8. Feedback Manager
Idea: Develop a product that companies can use to gather and organise user feedback, create tasks, rank by priority, and so on. This is a problem at many many companies, because most of the feedback from users simply gets lost. You can even combine this with the Survey Builder we talked about above.
Examples: UserBack
9. CMS for Managing Blog Posts.
Idea: Create a Content managment system where you can create new blog posts, manage them, publish to your own website, etc.
Examples: Sanity
10. HR Software
Idea: Create a product where companies can create an applicant tracking system for them where they can accept applications to their jobs, manage applications, set appoints, and so on.
Examples: Personio
Library Projects
This is a must-have if you’re looking to get a job as frontend engineer. Writting open source libraries and contributing to the community, will show your love for the frontend. Only negative thing is if your library is useful, you’ll have to deal with a lot of fame.
11. UI Component Library
Idea: Create a Component library with specific design system, create reusable components, more complex components, and so on. You can even sell your components like tailwindcss does for example.
Examples: NextUI
12. Authentication/Authorization Kit
Idea: Authentication/Authorization can be quite complex by itself, this is why a library f or this would be useful. You can create something that makes it easy to create login/signup pages, handle authentication sessions, handle authorization based on user role, etc.
Examples: Clerk
13. Analytics Helpers
Idea: Many companies use google analytics and so on, but they also come with privacy issues, etc. and they always have to ask users for cookie permissions for it. You can create a privacy focused analytics library that allows devs to create their own analytics solution without sending data somewhere.
Examples: Plausible (not the same as the idea above)
14. File Upload Helpers
Idea: Create a library to help with file uploads. Handle validation, uploading to different sources, and so on.
Example: Filepond
15. Gamification Helpers
Idea: This can be a really useful library if you’re creating chats, or communities, and so on. This library would help you gamify your platform, example create levels for users, show leaderboards, an so on.
Examples: Unfortunately I couldn’t find one.
Boring Projects
I only call these boring projects, because everyone talks about them, and a lot of people already have them in their portfolios. Though you should not ignore them. Using Next.js to build full stack apps like these can be beneficial as these are the typical “real” application for most of the recruiters/clients.
16. Job Board
Idea: Create a job board where companies can share jobs, and people can apply to them, either directly or links to another ATS.
Examples: Indeed
17. Recipe Website
Idea: Allow people to share food recipes, sell recipes, have a personal page with collection of their recipes, and so on.
Example: tasty.so
18. Event Management System
Idea: This platform would allow companies to create events such as webinars or similar, invite people, manage atendees, etc.
Example: Evenito
19. Portfolio Builder
Idea: In this product users would be able to create portfolios for themselves and publish them. You can create your own unique UI and add more features such as selling product, or similar.
Examples: I am creating something similar in reputable.so
Bonus
As a bonus I want to give you 1 tip only. Try to build something you love and enjoy, this way you’ll be way more motivated to do it, and it will help create a stronger image in your portfolio. Example you should not create recipe websites if you’re trying to find clients to build complex Saas for them. You can even create projects that help the frontend community if you’re trying to find a job. This way you can show that you really love what you’re doing.
Conclusion
I hope you found the project you want to build next using Next.js from the ideas above. My goal here was not to only provide you with specific ideas, but rather you try to create more unique ideas on your own, and I hope that worked.
If you have any questions, or want me to look at your ideas feel free to contact me through email: contact@codebymedu.com or check more in my blog https://codebymedu.com/blog
Top comments (0)