Demystifying your first portfolio UK (including app suggestions)
Tags: beginners, portfolio, webdev, discuss
Published: 2022-01-06 22:40:25

"Portfolio".

This word keeps popping up over and over again. You finally decide to start taking yours seriously as you realise it's one of the most important things to have, to land your first job ... get your foot in the door... get some validation... you get the point😄

A lot (and I mean a lot) of new programmers get stuck on what exactly to include in their portfolio.

In this article, I've done some research so you don't have to. Time to stop feeling overwhelmed and get clarity and direction on your junior developer portfolio.

## 3 skills every developer should learn


- App development (web apps and mobile apps)

Apps are everywhere. Need I say more? Being able to build an app; web or mobile is a fundamental skill to have. To build mobile apps; you could learn Flutter and/ or React Native. For web apps, you could learn React. 

However to kill two birds with one stone, React wins as you can learn one framework and build cross-platform apps on mobile and the web simultaneously.

- Networking basics

You want to know how HTTP requests work, about clients vs servers, API's (know how they work and how to build them) and JSON.

- Databases
 
“_Data is the new oil,_” they say.
speaking of data, here are even more compelling reasons to get you some data skills.

![Data consumption](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xl3y20s91tqpn9x1bgt3.png)
- companies will most definitely want to explore and make the most use of all that oil.

And so with these three components, you have a full-stack sandwich.

Can you get hired with static sites that don't have much use? ... Possibly. However **to optimise your chances, create realistic projects that people could use.**
 
If you can effectively demonstrate these three skills on your portfolio, you're laughing. 

P.s. These are also the skills necessary to; not just secure a job, but build a business if you're that way inclined. 😄

Oh, if you were thinking of contributing to open source projects like I was as a brand new programmer... Perhaps hold off on that until you've put together a solid portfolio and are technically able to contribute.

## 5 Backend-specific technical skills


- HTML, CSS, JavaScript

- Database skills (those data skills again! Learning some SQL even as a front-end developer will put you in a good position. _Periodt_)

- API's, for example, being able to connect Google Maps to your application.

- Good problem-solving skills. You could improve this by doing coding challenges on Leetcode, HackerRank, and Edabit. You could also learn data structures and algorithms, however, this should come once you're comfortable with a programming language.

Two other critical skills needed for your first job (all jobs really) are excellent communication skills and attention to detail. You will be required to communicate with technical and non-technical people from different backgrounds and different walks of life. 

It won't be a good look if you turn into jelly on the spot. 

![Jelly](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/030jgalgx7b349nx1j1j.gif)

You can improve communication skills by having regular conversations with technical people, writing articles and/ or publishing YouTube videos! 

You can improve attention to detail by following the best practice and style guide for your chosen stack. Also, aim for clean code where possible. 

"_Don't leave broken windows (bad designs, wrong decisions, poor code) unrepaired._" - The Pragmatic Programmer

- Last but not least, your ~~weapon~~ programming language of choice; and the stack surrounding it. For example, if you were to specialise in Node.js, a popular stack to learn is the MERN stack. MERN stands for MongoDB, Express, React, Node, after the four key technologies that make up the stack. 


| Level        | Type of app                                                             | Criteria                                                                                                                          | Number of projects to build |
|--------------|-------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------|-----------------------------|
| Simple       | Digital clock, to-do app, expense tracker                               | Does 1 - 3 things, no libraries/frameworks used, < 200 lines of code                                                            | 4 - 8                       |
| Intermediate | Classic video games (e.g. pong, snake, Tetris), calculator, web scrapper | Does 5+ things, < 500 lines of code, minimal libraries and frameworks used                                                        | 3 - 6                       |
| Capstone     | Social media clone, e-commerce store, chat app clone                    | Must be interesting!, does a lot of things, uses databases and API's, uses multiple libraries and frameworks, > 500 lines of code | 1 - 3                       |
_Table showing project types to include in portfolio_

## Other considerations.
I had started to build my portfolio without really knowing how I wanted it to look. If there's one thing you take away, let it be this: plan how you want your portfolio to look or have a very clear picture. 
 
Finally, your portfolio projects should demonstrate that you add value to your employer immediately. It takes time and resources to train a new programmer... Don't hold back on your skills and what you bring to the table. 

Things in tech move extremely quickly. Use the most up to date tech and syntax in your work. Also, do yourself a favour by ensuring whatever you're learning is easy to learn with resources (e.g. source code in GitHub repo) easily available.

## Final words and resources used

Last but not least, check out the videos I used as inspiration for this article (and my upcoming portfolio). 
_Remember you can do this!_

https://youtu.be/OPk4Pu97Ndc
https://youtu.be/L9k0Nxxd0Bg
https://youtu.be/RYE0QQKJI9o
https://youtu.be/Wf9oEdT9y4U
https://youtu.be/_Cb7SDwXy9M