At the beginning of this year, I was pondering what new programming languages and frameworks I should learn. Harvard and MIT both provide great courses on Introduction to Computer Science. I decided to take on the Harvard’s CS50: Introduction to Computer Science.

Table of Contents

1. Why CS50?
2. Note to Self

Why CS50?

I always wanted to learn a low-level programming language such as C. CS50 first few weeks materials were introduction to the C programming language, and sorting algorithms (bubble, merge and selection). I have to say, trying to solve sorting algorithms in modern languages (for example, JavaScript and Python) is much easier compared to C! On top of that, C’s utils function feels a bit cumbersome. malloc, realloc and/or free should be explicitly defined for memory allocation (heap vs. stack). Nonetheless, C (as well as any subsequent low-level programming language) usually gives better time and space complexity when solving algorithms.

Second part of the CS50 curriculum includes Python, SQL, HTML, CSS, JavaScript and Flask. The goal is to introduce rudimentary back-end and front-end framework. Python characteristic attributes remind me of Ruby’s terseness, Ruby was my first programming language. Both Python and SQL (SQLite3) eventually become the curriculum’s back-end stack while HTML, CSS and JavaScript performing as the front-end stack. Flask is the web framework, and I had the chance to learn and implement Jinja template engine.

This course was a bit more strenuous than I anticipated! First half of the curriculum was not easy to follow. However, I am glad that I successfully completed the course — so I can enjoy my Summer time. But first, I have to do some Spring cleaning. 😎

Here is my repo on CS50’s weekly assignments. I had so much fun on their first week’s assignment with Scratch. 😆

fentybit

@fentybit

Spent the whole day making this game with #mitscratch 😆 first assignment with #cs50x #cs50 🦖🌮

01:54 AM - 30 Jan 2022

Note to Self

Note to Self is my CS50’s final project. It is a simple to-do application that allows users to log their tasks. First time user would be required to register, and returning user needs to log in. The Minimum Viable Product (MVP) of Note to Self is for the user to be able to log chores along with corresponding level of priorities. User will be prompted to record their first task.

I created two tables on users and todos with basic schema. Each user has many tasks, and each task belongs to a user. The user_id foreign key indicates the two tables’ relationship.

CREATE TABLE users (
  id INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL,
  username TEXT NOT NULL,
  hash TEXT NOT NULL
);

CREATE TABLE todos (
  id INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL,
  user_id INTEGER NOT NULL,
  priority INTEGER NOT NULL,
  title TEXT NOT NULL,
  description TEXT
);

It took me sometime to get used to Jinja templates on my local IDE, my VSCode linters automatically re-format. I learned from Stackoverflow that I had to add "emmet.includeLanguages": {"jinja-html": "html"}, to my settings.json.

Basic validations on /register, /login and creating a /new task are provided. On /register, user would have to include username, password and username should be unique (no duplication). /login requires both username and password. A /new task requires priority and title. Otherwise, the user will not be able to proceed further.

I included a logic where as the user logs a new task, the one with higher priority will always comes first (descending order). ☆☆☆ tasks will come before ☆☆ tasks.

Note to Self was completed in 3-day timeframe from implementing JavaScript, Python, SQL and Bootstrap library. Future cycle of product development as follows:

• Edit. User can only create and read. Ideally, we would like edit and delete functionality.
• Quick Find tab. Over the time, user will have many tasks, and it gets troublesome when the user needs to immediately access a specific task entry. A search bar to quickly type event title and access the journal entry would be useful.
• Current task entry allows priority, title and description attributes. Each entry should have more functionality for the user, such as weather, scheduling, sharing capability, image upload and so on.
• Create a toggle track for dark mode. 😎

fentybit / NoteToSelf

To-Do application.

Note to Self

Domain Modeling :: To-Do Lists
To-Do Tasks app with Python, Flask and SQL frameworks.

YouTube Demo

DEV Blog

About

This is my final project of CS50 (CS50x through edX), Harvard University's introduction to the intellectual enterprises of computer science and the art of programming.

Note to Self app is a To-Do Tasks application. First time user is required to register, and returning user needs to log in. The Minimum Viable Product (MVP) of Note to Self is for users to be able to log chores along with correspoding level of priorities.

Project Files

├── static
│   ├── apology.gif
│   ├── favicon.ico
│   ├── giphy.gif
│   └── styles.css
├── templates
│   ├── apology.html
│   ├── index.html
│   ├── layout.html
│   ├── login.html
│   ├── new.html
│   ├── register.html
│   └── todos.html
├── app.py
│       user flow, business logic
├── helpers.py
│       apology, login_required
├── notetoself.db

…

View on GitHub

External Sources:
Bootstrap
Giphy
Jinja