Creating a Web App - Part 1

  • Coding
  • Git

June 1, 2023

Starting a new web app project from scratch is a challenge, especially for beginners in programming. Nevertheless, the most effective way to learn is by actually doing it, making mistakes along the way, and gaining valuable insights from those experiences. So that's precisely what I'm gonna do.

The idea
Currently, I rely on several different apps on my phone to perform various tasks such as project management, note-taking, creating to-do lists, managing my calendar, using a pomodoro timer, and budgeting. I aspire to develop a web app that consolidates all these functions into one platform.

The design
Now that I have determined the app's functionality, I begin by sketching out ideas on paper and after that I create a design for each page using Adobe XD. I anticipate making design modifications throughout the process, however, it is crucial to have a roadmap to follow. Starting coding without a clear design concept will result in significant time loss along the way.

Setting up my coding environment
I'm using Visual Studio Code as a code editor. I highly recommend it - it's free, open source, has lots of extensions and it has an integrated terminal. Inside the editor I'll create a project folder and inside that folder I'll set up a Git repository using the command line git init in the terminal. Using Git, I'll be able to track all the changes and progress in my project. Finally I'll create a .gitignore file where I'll list all the files and folders I don't want to be tracked by Git (like .DS_Store, node_modules, .env file and so on...). For more on this subject I would recommend this article by Dionysia Lemonaki on

That's it for now, stay tuned for part 2 where the actual coding journey begins...