Back to blog

So you want to be a computer scientist?

December 30, 2024
GuidesTechnical

If I got hit by a bus and forgot everything I knew about computer science [1], here is how’d I re-learn it [2].

Inspired by Robert Heaton’s “Projects for Advanced Beginners” (link) and a bunch of random knowledge I’ve accumulated over time.

‼️ Are you already someone with knowledge in the field of computer science, and looking for resources or opportunities? I encourage you to look at csjobs2 instead. This is my curated list of every-resource-ever I considered in undergrad, and has suggestions for wannabe engineers, PMs, VCs, etc.

Let’s get to it.

First: the number one thing to understand is ‘coding’ is something you learn by doing. There is a lot of theoretical stuff to know (—whose importance varies with your goals), but fundamentally you need to code. A lot.

So, let’s “learn by doing.” To give that some structure, your curriculum will come as a curated list of projects. This will be supplemented by things to read or look at when you get board. And then some philosophical advice how to have your projects be more than a tree that falls in the forest.

First, some principles.

Principles

  1. Digital assistants (Claude, ChatGPT) are good, but you can only use them like a university TA. That is, they cannot write code for you, you cannot copy text from them, etc., but you can (and should) ask them explanatory questions.

    ✅ “What does this bit of code do?” “Any hints for what’s wrong with my approach to this problem? DO NOT OUTPUT THE ANSWER. (problem) (approach)”

    ⛔ “Write a webpage skeleton for me,” “output a function to reverse a linked list in Python”

    You should use digital assistants (…you have a literal TA available at your disposal 24/7), but you must use them correctly. Discipline is key!

  2. You also must disable any code “complete” tools (i.e., anything that writes code for you in a text editor).

    Imagine learning to bike but never being able to take off the training wheels. Would you ever be able to do cool shit, like a wheelie?

    For example, if you use Visual Studio Code, add this in your editor.

    javascript
    // at .vscode/settings.json
    {
      // ...
      "github.copilot.enable": {
        "*": false
      }
    }
    
  3. You journey must be in public. Once you finish a project, deploy it to a URL, post it on LinkedIn, Twitter, etc., send it to your friends, your mom, your dog, etc. Get people to use it, give you feedback, and fix their bugs. (This will pay off dividends down the line.)

Need a community of people to do this with? Look at Summer of Shipping, various sub-reddits (e.g., r/dailyprogrammer), or Discord communities.
4. Have fun!

Curriculum

Your first task will be to build a website. Not using like, Framer, or Bubble, or even Notion, but with HTML (”HyperText Markup Language” for page structure and content) and CSS (”Cascading Style Sheets”, for style).

Why a website? This will serve as your digital playground. You’ll build it, then re-build it, then re-build it again, and again, and again. Each iteration will represent a new milestone in your learning. Each feature will be a test of your knowledge.

“But Michael,” you say, “I have no interest in being a web programmer!” Good. You still need a website for sharing your work. And basically every project you make can (and should) be hosted or have an entrypoint on your website. (Think a “download” link for your desktop app, or a landing page for your mobile game.) In addition, a lot of frameworks support cross-platform development today, so you might be able to accidentally be good at web programming. Which is also good.

Here are some resources you can use to get you unstuck.

  • Khan Academy (very basic, just to get you started—watch a few videos, they have a nice online playground)

  • MDN’s web docs ← this is the one you’ll actually use to make your site. Read everything on here like a sponge. Do “Your first website.”

  • Frontend Masters (more advanced, as you start to want to do fancier things with your site)

If you finish your website, I know you’re serious. Exciting! Go to GitHub.com and make an account. Create a “repository” and upload your code there.

Still a student? Skim through these resources and see if anything looks interesting. (For example, you can get 6 months free to Frontend Masters!)


Next, I’m going to hijack your social media feeds. Subscribe to all these people.

  • The Coding Train, 11/10 programming tutorials—sort by popular

  • Fireship, light educational content and tech culture

  • Computerphile, fun, advanced content

  • 3Blue1Brown, math and computer science

  • (…more to come as I think of them…)

This is a very passive way to supplement your learning. Hijacking my social media (with gym bros instead of computer scientists) helped a surprising amount when I started going to the gym.


OK, next, you’re going to work through some practice problems to learn a language a bit harder than HTML and CSS. (Practice?!)

Your choices are JavaScript or Python.

Other languages are good too… but later. Credit: me.
Other languages are good too… but later. Credit: me.
  • Practice-It → CodeStepByStep (do this first)

    • (I’m working on getting an instructor code. Once I do that I’ll add it here.)
    • For now, CodingBat is a good beginner introduction. Then look at Codeacademy’s courses.
  • Advent of Code (do this every Christmas; work through as many days as you can)

  • Grind 75 (once you need a job, becomes especially relevant)

Pick a few problems a day, as many as you can muster. They’ll be boring at first, but quickly get interesting. This will help ease you into language “syntax” (i.e., how to ‘speak’ it).

Consistent practice is key! Even a minute can be enough, just to give you continual exposure.

Forgive the corny meme, but it’s true. Credit: LinkedIn.
Forgive the corny meme, but it’s true. Credit: LinkedIn.

This learn-by-doing approach sometimes hits a roadblock. Here are some resources for either language to help aid your learning.

JavaScript

Python

Here’s a kind-of checklist to note down your progress.

  • Run a program, output to the screen (print, console.log)

  • Store information in variables (x = 5)

  • Do basic math

  • Work with text (”strings”), do basic operations over strings

  • Write logic with if-(this-else-that)-statements (some people call this “control flow”)

  • Use lists to store multiple items ([”hello”, “world”])

  • Write logic with loops (each for <N times>: print("hello"))

  • Create functions to organize and name your code

  • Read and write to files (text files, CSV files—i.e., a spreadsheet)

  • Get input from users

  • Handle basic errors; learn what an “exception” is

  • Install a use packages from the 🌐 internet 🌐

  • Organize your code into multiple files

Okay, enough reading (talk about boring). It’s time to get back on the project train.

Projects

Here is a list of projects. Some advice:

  • Make these projects your own; I’ve intentionally left them rather underspecified, so use your creative freedom. Have fun!

  • Every time you finish: (1) make sure it’s on GitHub, (2) deploy it to a URL, and (3) share that URL everywhere you can think of.

    • As a bonus, if you know someone who’s “nice with computers”—have them review your code and give you feedback.
  • Don’t spend too long on any of these.

  • (Also another bonus tip: it’s okay to implement a kind-of dumb feature if it lets you practice a code coding language feature you learned. It’s about practice.)

If any of these bore you, skip ‘em. Again, it’s about your learning. (I think they’re fun though.)

Hangman

Implement the game of Hangman using your language of choice. The way it should play is…

  1. Press “start”
  2. Have an input to either guess a letter, or guess the entire word
    1. If the player guesses a letter, either
      1. Mark off where that letter is
      2. Or add a body part
    2. If the player guesses a word, either
      1. They won!
      2. They lost :(
  3. Repeat (2) until they either win, lose, or finish the body parts

The generate text output, you can Google for Hangman “ASCII” art.

As an extension: make a mode for two players, where one player can choose a word and mark off the appropriate letter positions.

Hangman, mid-game. Credit: Wikipedia.
Hangman, mid-game. Credit: Wikipedia.

Conway’s Game of Life

It’s not really much of a game, more like an art piece. Here’s the description.

The Game of Life, also known as Conway's Game of Life or simply Life, is a cellular automaton devised by the British mathematician John Horton Conway in 1970. It is a zero-player game, meaning that its evolution is determined by its initial state, requiring no further input.

You start with a 2D grid of squares, either filled or empty. You determine the next game state via the following rules.

plain
1. Any live cell with fewer than two live neighbours dies, as if by underpopulation.
2. Any live cell with two or three live neighbours lives on to the next generation.
3. Any live cell with more than three live neighbours dies, as if by overpopulation.
4. Any dead cell with exactly three live neighbours becomes a live cell, as if by reproduction.

Your game will consist of code to render the grid, and code to determine the next grid state.

As an extension exercise, try figuring out interesting starting positions for yourself!

Is this life? Credit: Wikipedia.
Is this life? Credit: Wikipedia.

Tic-Tac-Toe

Now that you have some experience with more interesting game states, let’s try tic-tac-toe.

The game should support keeping track who’s winning (player 1, or player 2) after multiple rounds. It’d also be cool to be able to track the game’s history, and jump back in time (“undo”).

Tic-tac-toe. Credit: Wikipedia.
Tic-tac-toe. Credit: Wikipedia.

Snake

Last but not least: snake!

Implement the classic game in your terminal. Make sure the user dies if they hit themselves, or hit the wall.

As an extension: implement a Tron version with two playable snakes.

Snake! Credit: Wikipedia.
Snake! Credit: Wikipedia.

🛑 STOP! 🛑 We must take a non-coding interlude. This is the point at which you can create a very basic resume, that lists out the few projects you have here. But you’re not allowed to do it in Word! Oh no—we use much more annoying tools in this discipline.

Go to a website called Overleaf. Google “Overleaf latex resume templates” and scroll through to you find one that (a) you like and (b) meets these strict requirements:

  1. Single column.
  2. Has the following sections: experience (or equivalent), education (or equivalent), projects (or equivalent).
  3. Does not have: a profile photo, an “about” or “objective” section.

Then, edit the template to match your content. LaTeX (the language you’re now looking at, after forking the template), is a bit trickier than HTML, but a similar kind of mark-up language. I’ll make an exception to my Principles for a brief moment: you can get ChatGPT (or equivalent) to help you as much as you like with this one. LaTeX is not something you’ll need on a job, but is good for writing very nice docs (and just is something you should know).


Alright.. back to some ✨ more advanced ✨ projects.

Digital Analog Clock

For this one, you’re going to make a analog clock, by digital means.

Your end picture is going to look something like this.

A analog clock program. Credit: the Processing website.
A analog clock program. Credit: the Processing website.

(…with the hands actually moving.)

To do it with JavaScript, I recommend using Processing.js.

To do with Python, I recommend using Pygame.

You can compute a lot of stuff manually, but this is a first example of where a little bit of math will go a long way to simplifying your code. Time to pull out that high school trigonometry knowledge!

Blog

It’s been a while since we’ve taken a look at your website. Your next project will be to add a blog! It’s okay if you don’t write (…but you should!); this is just a good way to extend your web development skills.

To make the blog, create a folder on your website that has a series of Markdown files. Markdown is sort-of like a stripped down HTML, useful for writing documents. Your website should take those files and ‘turn them’ into a series of web pages—this technique is usually called ‘static site generation’ (static because it happens at build time; not dynamic since you can’t update the blog post in real-time).

You'll almost certainly need JavaScript to do this, though there are options for Python (look-up Pelican). For JavaScript, you have many options: considering learning React.js (and it's “cousin” Next.js).

You can also choose frameworks in other languages, like Hugo (which uses Go). Your options are plentiful here! Feel free to do some exploring yourself. (It's your website!)

As an extension: try hosting other kinds of content from your website (e.g., a photography portfolio).

AI-Kinator

AI is all the rage now. But did you know using ChatGPT via code is as easy as this?

python
import openai

openai.api_key = 'your-api-key-here'
response = openai.ChatCompletion.create(
    model="gpt-3.5-turbo",
    messages=[{"role": "user", "content": "What is the capital of France?"}]
)
print(response.choices[0].message.content)

An API key should always be kept private. It is your secret key for accessing a (usually) paid or private service.

Go get one for ChatGPT from here. Add a tiny bit of money to your account (I think $5 is the minimum).

Now we’re going to re-make our own version of the Akinator. Except for yours, you’ll use ChatGPT as the all knowing Ak. You’ll have to do quite a bit of Googling to figure out how to use the API effectively, but the core idea is quite simple. Prompt is to ask you questions to guess the person you’re thinking of, in a loop up to 20 guesses.

Text Omegle

Omegle was a video chat mired in controversy. It got shut down recently by its creator.

Your final project will be to make a non-video version! The app should work as follows:

  • A welcome screen where users can put in a keyword

  • If someone else has put in the same keyword, they’re placed in a room

  • They can chat, until either user disconnects

Extension work can include giving either user a bit beefier of a profile (e.g., a profile picture, bio), and smarter matching for non-exact-but-kind-of-matches (e.g., “american football”, and “football”).


Finally, here are some fun extensions to take depending on your interests.

Interested in data science or machine learning? You may want to beef up your math foundations a bit. Khan Academy, MIT OpenCourseWare, etc., have a ton of machine learning offerings. Kaggle is also a good resource for getting real-world experience.

Interested in game programming? Make games! World’s your oyster here. We’ve mostly done 2D stuff, but you can install Unity and venture in 3D programming. Gamejam’s are a good way to build your skills quickly.

Interested in web development? The “classic” web dev next project would be a todo list. If you didn’t already, learn some JavaScript and then tack on a framework like React. React’s tutorial is a great starting place. You should also get Frontend Masters.


At this point, if you’ve really stuck to the plan, you’re ready to move on from this guide. Here are some resources to continue along your journey.

  • roadmap.sh, a collection of developer roadmaps (i.e., career path ↔ learning track)—very helpful!

  • Learn math → Khan Academy, Numberphile, 3Blue1Brown, MIT OpenCourseWare’s stuff, Aelph’s guide (to get advanced)

  • Learn computer science theory → Computerphile, 3Blue1Brown, MIT OpenCourseWare’s stuff (to build up a make shift degree), and the ultimate resource: teachyourselfcs.com

    • If you want to be a capital ‘S’ scientist, that last one is your best bet with structuring the sea of resources on the web
    • …but this hands-on start is a way to make sure you can actually build something before you get lost in the definition of a hashmap—which I think is the way to go (have fun and make things first, then cut away at layers of abstractions through a great education)
  • Get a job → csjobs2, the other doc of mine that I send people a lot, which is a compilation of resources for levelling up in industry

Remember: the only way to get better is to keep programming.

Thanks for reading! Find this valuable? Hate this guide? Have a funny joke you’d like to tell me? Feel free to drop a line at michaelfromyeg [at] gmail [dot] com.


Edit (2025-01-05): I recently stumbled across Peter Norvig’s Etudes, which has a number of additional small, but difficult programming project ideas.

Re-implementing one of these and then comparing your solution to Norvig’s would be an excellent way to continue your practice.

Footnotes

[1] Doesn’t that sound nice.

[2] Oh god.

Comments