Portfolio Project Ideas

# Choosing a Project

There are basically 3 types of projects you can pursue.

- Passion Projects
- "Cliché" (but GOOD!) Projects
- Other Useful Projects

Pro Tips™:
- **Documentation is most important** (see [Exact Instructions Challenge](https://www.youtube.com/watch?v=Ct-lOOUqmyY))
- Focus on your strengths - if you suck at JavaScript, focus on the HTML and CSS. If you suck at CSS, write a CLI utility.
- **No one looks at your code** to look at code. Your project **MUST** first show that it's valuable (and the value can be that it's fun or interesting). READMEs are a **MUST**.

## Passion Projects

The best project is something that you're personally interested in or directly connected with - such as a tool to help a friend's business. This is good because:

- You inherently understand both the problem and solution
- There's a real reward - your own enjoyment - once you complete it
- You have a stronger desire to finish it, and share it

## Typical Projects

If you don't have a passion project - just pick one of the common projects - just because they're cliché **does not** make them bad. In fact, they're quite _good_ - and you should at least know how to write them anyway.

These are **simple to understand**, **easy to create**, and there are [**lots of examples**](https://todomvc.com/) out there to review if you get stuck.

1. Unix utils: **`tree`**, **`curl`**, etc
2. **Markdown Blog**
3. **Bot-Friendly, Human-Readable Resume**
3. **To Do List**
4. **Chat Server** or Bot
5. **_Nerdom_ Quiz** or Compendium

### 1. Unix Commands, such as `tree` & `curl`

- **`tree`** - recursively print out files and folders, replicating unix `tree`, or [`lsd --tree`](https://webinstall.dev/lsd)
- **`curl`** - fetch web requests, modifying headers and body, replicating unix `curl` or [`curlie`](https://webinstall.dev/curlie)
- **`stat`** - give file metadata (size in various formats, created at, modified at, etc)

### 2. Blog

**Markdown Blog** - built in any language with Markdown, YAML, and a way to configure and apply a Theme

### 3. Bot-friendly, Human-Readable Resume

HR Departments use CRM software called "ATS", which makes good resumes look terrible, and bad resumes look not worse.

Create a resume template that plays well with `pdftotext` and ATSes, that also isn't an eyesore.

See https://github.com/BeyondCodeBootcamp/html-resume/issues/5

### 4. To Do List

**To Do List** - Create a simple Notes or Reminders app for yourself

### 5. Chat Server or Bot

**Chat Server** or Bot - Write your own simple chat app, or write a bot for an existing one

### 6. Quizzes & Compendiums

**_Nerdom_ Quizzes** & Compendiums - Write your nerdom quiz or compendium

- Nerdoms
- Harry Potter Sorting Hat quiz
- Which Power Ranger are You
- Pokédex - (https://github.com/PokeAPI/pokeapi ?)
- Hyrule Compendium
- Similar movies / artists / books / games
- Some examples out in the Wild:
- https://swapi.dev/ - Star Wars API
- Here are some CLI examples that I wrote:
- [`npx color-code`](https://github.com/coolaj86/the-color-code) (the color code quiz)
- [`npx love-language`](https://github.com/coolaj86/the-5-love-languages) (the 5 love language quiz)

### 7. Unix Developer Tools
- **`aliasman`** a cross-platform tool to manage aliases across bash, powershell, fish, etc (`alias gcf='git --amend --reuse-message HEAD'`)
- **`envman`** a cross-platform tool to manage ENVs across bash, fish, powershell, etc (`GITHUB_TOKEN=gha_xxxxxxxxx`)

**Critical Coding**: Think about some app you use every day - Slack, Spotify, Notes, etc - and find something that bugs you about it or that you wish it had. Then make a clone of that thing, focusing only on what you would make better (and the documentation and deployment, of course).

# But... why is the time gone?


In reality, the presentable code that you write for a portfolio project is only about 10-25% of the work.

About 50% is the documentation and publishing:
- Creating Issues and task lists to track your goals and progress
- A nice README (todo create template)
- Short, Tweetable description
- Visual preview
- Quick Start
- Host a demo online
- Publish to the package repository (npm, cargo, git) or app store
- Announcing
- YOUR Blog
- LinkedIn
- add to LinkedIn portfolio
- put in a related LinkedIn group
- Twitter
- reddit
- HackerNoon
- Facebook
- Possibly a Video Overview

Another 50% is research or trial-and-error - hence it takes 3 days to write 100 lines of code (or maybe just 50!)

Oh, and by the way - if you spend less than 400% of the time, you've done a great job. Be proud. 😉

# More Projects (see below)

1. Resize an Image (in the Browser, with Canvas and scaling)
2. Random String Generator (suitable for API keys and Passwords)
3. File System as a Spreadsheet (an alternative way to manage files and folders)
4. _Personal_ Search Engine (e.g. index your Social Media, Blog, activity on StackOverflow etc) (note: Matt Holt's Timeliner)
5. coreutils++ - crossplatform cli tools
- a `readlink` or `abspath` that works cross-platform, similar to GNU readlink
- a `relpath` command that, given two paths, yields a relative path if possible \
https://stackoverflow.com/questions/2564634/convert-absolute-path-into-relative-path-given-a-current-directory-using-bash
- a `stat` command that can return the size of a file in bytes, or other units (KB, KiB, Kbit, MB, MiB, Mbit, etc)

## Useful tools
- [Adobe Kuler](https://color.adobe.com/) to pick complementary colors
- [MVP.css](https://andybrewer.github.io/mvp/) - "Classless" CSS for Semantic HTML & Markdown
- [more classless CSS](https://github.com/BeyondCodeBootcamp/beyondcodebootcamp/issues/9)
- [Utterances](https://utteranc.es/) - enable feedback via github issues