DEV Community

What are some project ideas that beginners can work on to show in their portfolio?

Ermal Shuli on December 23, 2017

Unfortunately I can't come up with project ideas! Whilst learning, I'm always creating something, but it's usually a todo app, ecommerce concept, a...
Collapse
 
alephnaught2tog profile image
Max Cerrina

Reinvent the wheel. Perfect for stuff like this. Look at apps you like or sites you like and implement them yourself. Simple text editor in a browser, stuff like that; it doesn't have to be some amazing brand new concept.

You mention todo apps -- have you made more than one? What about making a series of them for different purposes or audiences? What about a todo app aimed for people playing video games to track quests? or a todo app specifically for code? It sounds like that's a schema you like playing with, so I say, rock that!

Collapse
 
ermal profile image
Ermal Shuli

I have been wondering about this. There are few apps, like editors in a browser, that I've seen and thought "if only I thought of that"

And, for todo apps, there's so much nuances between simple todo to a project manager, to trello board like.

But I always felt that the next project has to be a) unique and b) completely different in genre to the previous.

Thanks for this comment.

Collapse
 
alephnaught2tog profile image
Max Cerrina

Nah. I feel like half the time too, starting one project is how I end up discovering what really draws me and what I want to work on--while working on my last PHP assignment, i kept coming back to this idea in my head over and over and starting that, so as soon as the semester was over I started some other project and went... oh hey, getting pulled this way again, let's just follow it!

Collapse
 
itsjzt profile image
Saurabh Sharma

Here are some suggestions:

Well you can try to complete some FreeCodeCamp Projects or try to replicate Picked Pens on Codepen

Collapse
 
orkon profile image
Alex Rudenko

Do you have some other hobby except for programming? Try to come up with a project that helps you with your hobby. Or develop a game! It's always almost fun and you will learn a lot.

Regarding contributing to open source, check this guide out opensource.guide/how-to-contribute/ Hope it helps.

Among ideas I have at the moment but which I will not act upon, most likely:
1) advanced video editor with features like removing the green screen and combining multiple tracks
2) a web tool to visualize encoded polylines on an OpenStreetMap
3) routing engine in JavaScript (started here github.com/orkon/routine)

Collapse
 
pmcgowan profile image
p-mcgowan • Edited

Contributing to open source can be intimidating, but likely project maintainers will be glad to help or guide you - your contribution doesn't have to be huge, and since you're going to spend more time reading and understanding code than writing it as well as conforming to pre-existing code styles, it will be very useful experience. I would reccommend contributing to a game or utility that you already use, as it benefits you and you will have experience in the UX.

Another thing could be building a utility for your self. I remember the first program I ever wrote was a budgeting app in C, as I was always writing down and doing the math on my bank balance while in school. It opened the door to automating daily tasks and was useful in helping guide me to learn more about the software.

And as mentioned above, build a game. It's fun and makes testing much more interesting. Maybe something with a simple AI, like battleship or a card game.

Collapse
 
okolbay profile image
andrew

I wanted to pitch “implement stl” of a language of your choice, but since OP wants to add it to portfolio, I think contributing to open source is the best advice. If one-man backed app is not a breakthrough on the market, without proper pressure from business your yet-another-blog-clone of a current generation product would look most likely quite poor.

Collapse
 
pmcgowan profile image
p-mcgowan

For sure - leverage the open-source community. I remember working on this utility, and a good way through I stumbled across a very similar one built by a company I had heard of, and I got a bit discouraged as it was much better. That being said, it's still good experience either way, but open-source has the added benefit of building teamworking skills.

Collapse
 
courier10pt profile image
Bob van Hoove • Edited

In addition to many great suggestions in this thread, here is another idea:

Many websites are hard to read on wide screens because the lines are too long and the distance between lines is too small. I often find myself going into the developer toolbar to add the following CSS properties:

p { max-width: 40em; line-height: 1.5em; }

Somtimes I adjust the line height a little but that 40em seems right in general.

Now I could save myself some time by writing a browser plugin to do that for me via a button click.

A couple of interesting properties of this project would be:

  • It's small
  • Scope is well defined
  • It solves a problem for me :)

Now ideally it should solve a problem for you. Just trying to show it doesn't have to be a huge thing. Mini-projects are great to get the ball rolling.

Collapse
 
niorad profile image
Antonio Radovcic

Games, games, games. Try to make pong and breakout to get your feet wet, then you could attempt a platformer, cookie-clicker, or a puzzle-game.

Here's why I think games are good for all-around improving as a dev:

  • Games can get infinitely complex, but simple games can also be interesting.
  • You can build them in any language/tech-stack.
  • You learn to fight scope-creep pretty quickly.
  • Suddenly you have use-cases for all the algos you usually only need at interviews (according to HN at least). Like for wayfinding, AI etc.
  • The audience is much bigger for games than for, let's say, a JS-Library.
  • You get to do interface-design, which is useful if you usually only do backend/systems-dev.

I'd suggest starting web-based. Check out lessmilk.com/

Collapse
 
bebischof profile image
Dr. Donut ☕️

Apologies for the self-promotion but I have an entire blog dedicated to open-sourcing project ideas: medium.com/100000-arrows/gathering...

Please, take one of my ideas and run with it! Just post and let me know if you do! :-)

Collapse
 
darkliahos profile image
Sohail Nasir

As someone who has interviewed juniors and graduates myself, I often like to see something new and not reinventing the wheel. So for example I had one graduate developer come into an interview and he showed us a simple 2d game which incorporated new ideas he had been working on and showed us sample code snippets and talked about how he could polish it and where he could improve the code as well as taking pointers from me about small things around the code.

I often would say an interviewer seeing 10-20 app that all are todo lists would get bored fast and this does not show creativity and ways that one would have to go to engineer something new.

I am not saying go complicated but maybe if you wanted to do a list app, introduce a feature that would sell it like cloud syncing through Azure or maybe if you add a list item it automatically sends a text message to yourself, etc.

Anyway that's my 2 pennys worth.

Collapse
 
hdv profile image
Hussein Duvigneau • Edited

Just do so small stuff in codepen.io:

  • Take a new/underused CSS quirk and toy with it. (eg using CSS mixed-blend-mode to do some quirky stuff with select: codepen.io/collection/nrxmJV/ or using the order property to annoy the user: codepen.io/ElGoorf/pen/YwWVWe)
  • Take a standard form element then show how you could make it better with jQuery/React/Angular. (eg. making select drop-downs multiline: codepen.io/ElGoorf/pen/GrKPxR)
  • Take a cool feature that most people take for granted, like infinite scrolls or anchored headers, and try to recreate (or improve) it
  • Take a feature that most people create in JS, and see if you can make it CSS only
Collapse
 
rhymes profile image
rhymes

I remember that a few years ago "building a blog" was all the rage as a starter project. I would try to replicate something I use every day, maybe not the browser itself but some other app :-)

Regarding contribution to OSS, maybe these can help you:

and the OpenSource guide

Collapse
 
hrmny profile image
Leah • Edited

As others have said, clone something existing, but start very small, minimum viable product, just so you can see what exactly is happening

Also this has some ideas:
medium.freecodecamp.org/the-secret...

Collapse
 
pencillr profile image
Richard Lenkovits

This is might be very specific to backend and CI/CD, but in case if you have any code, literally any code, you could simply build a CI workflow around it in case you want a build automation portfolio too. Create a Jenkins server, probably above docker, or with ansible, and implement complex pipelines, that build separate parts, test, unit test, and report through e-mail or messages about different states.

Collapse
 
ctrlshiftbryan profile image
ctrlshiftbryan

At a previous job we used to interview all candidates with a very open ended "code day". The prompt was simple. Build and app that calls a public web api.

Showing that you can work with existing systems and apis will give great "real world experience".

Collapse
 
across_the_grid profile image
Nicho

I scrolled through my bookmarks and finally found this website again: oduta.com. If you need some inspiration, you should check it out! Happy coding!! ✌️

Collapse
 
cristinasolana profile image
Cristina Solana

A bookmark manager is a good and useful one.

Collapse
 
chiangs profile image
Stephen Chiang

To do, inventory management, consume and use an api, crm tool, small business accounting app etc

Collapse
 
hudsonburgess7 profile image
Hudson Burgess

RSS reader. It’s nontrivial in terms of learning the framework, interacts with a 3rd party service, and is something you could actually use day to day.

Collapse
 
enzoftware profile image
Enzo Lizama Paredes

Im sure that link : dreamincode.net/forums/topic/78802... will help your decision. Greets

Collapse
 
larswaechter profile image
Lars Wächter

Here you can find some ideas: dev.to/yaphi1/javascript-project-i...