DEV Community

Cover image for My 100DaysOfCode in a nutshell πŸ₯œ
Kirill Inoz
Kirill Inoz

Posted on • Originally published at inkuantum.hashnode.dev

My 100DaysOfCode in a nutshell πŸ₯œ

At the end of November 2020, I became more active on Twitter. I started to follow more content creators and just great people who gave me insides and tips about a fairly new domain for me called web development. This was the time when I also found the 100DaysOfCode challenge. Although I saw a lot of great projects people were working on as part of this challenge, I still didn't want to participate in it. The main excuse was lack of time, which was caused by school (so I thought at that time). But with a new lockdown announced at the start of December and a new course by Florin Pop and Brad Traversy all the stars aligned for me to start with this challenge.

So this is "My 100DaysOfCode in a nutshell πŸ₯œ".

From Day 1 to Day 50

The challenge began on December 4th when I started with the course "50ProjectsIn50Days". This course is made by the people I mentioned above and is oriented to practising the fundamentals of HTML, CSS and JavaScript. I found this very useful as I was lacking experience, especially in the JavaScript sector. Another beauty of this course was its perfect match to the 100DaysOfCode challenge, as I wouldn't need to plan anything for the first half of my challenge.

So that's what I did. I followed this course and worked every day on a new project. Most of the projects took me about 20-30 minutes to complete. But I didn't stop there...

Another blessing of this course was the creative part. Because the projects are so small, you have enough possibilities and time to customize your projects. I took another 20-30 minutes for customizations. I tried to keep them simple but also useful in the context of the current project. Sometimes it was a design change, other times an additional functionality, I tried everything.

After finishing this course, I was confident enough to try out a framework. I chose Vue.

From Day 51 to Day 61

To be honest, it wasn't my first encounter with Vue. But it was the first time that I was building a fully fledged web application with this framework.

I decided to build a weather application, as I wanted to try to incorporate some kind of Rest API into my app. To make it more interesting and different from other weather applications, I saw out there, I decided to use glassmorphism as the main design theme. I read a lot about it in the past and found some great websites which made it easier to create glass panels with CSS.

I didn't have any big problems building it and in just 10 days of code I finished it.

If you want to find out more about glassmorphism and why you should use it, check out my blog post πŸ‘‰ Glassmorphism - what's so interesting about it?

From Day 62 to Day 68

The next project I wanted to do was an e-commerce type of application. As product, I decided to go with fast food like sandwiches and additional drinks, deserts etc. The project consists of a landing page, menu and sandwich builder.

To make the sandwich builder more authentic and realistic, I went on the Subway page and looked up ingredients they use in their sandwiches. When constructing your perfect sandwich, you're limited on how many ingredients you're able to choose. This is because a lot of companies do that to not run into any financial problems because the sandwich price stays consistent. The menu is split into two parts, the menu itself and a basket where you can see what products you have already selected.

This was pretty much it. In the end, I never published the project as I didn't like how the design turned out.

From Day 69 to Day 71

After the blow with Empare (that's what the last project was called), I decided to uplift my UI and CSS skills. I read more about design and followed more accounts which posted about it on Twitter. For a long time, I've been following Pratham and Jay on Twitter, who post beautiful CSS art. That's when I decided to try it out myself.

There is not a lot to say about it except that it seemed more difficult than it actually was. Then I wrote a full breakdown of this project and published it on Hashnode and DevTo. It was my first blog post that really took off and received a lot of attention.

If you want to find out more about this project, check out my blog post πŸ‘‰ Ukulele with CSS

From Day 72 to Day 90

Besides ukulele, for which I created a CSS art, I have another passion which is football. For a long time, I wanted to create The Higher Lower Game clone, but with footballers and their goals. The problem then was that I didn't know how to get the information (such as footballer's names, goals, etc.) and how to set up the backend. At this point of time, I already knew how to get the first one done and that's what I've directly taken care of as well as the frontend. The backend was completely new to me, so I decided to take The Complete Node.js Developer Course on the side while working on the other things for this project. I learned about Node.js and Express that allowed me to finish this project.

If you want to find out how I got the information on footballers for this project, check out my blog post πŸ‘‰ Web Scraping with Puppeteer

From Day 91 to Day 100

The last but not least is my current project - Circlist. It's a web app that allows you to gather people, you interact the most on Twitter with, in one or multiple lists. This isn't my first take on the Twitter API, but surely the biggest. The project nears its first beta-testing and likewise its final release. I already finished the application. The last thing to do is the landing page, which will take some time to design and then to build. So certainly not one I could complete in the last 10 days and which goes beyond this challenge.

So that was "My 100DaysOfCode in a nutshell πŸ₯œ". Thanks for reading and have an amazing day! β™₯

Where can I find these projects?

50Projects50Days | GitHub

Holo Weather | Website & GitHub

Empare | Never published

Ukulele | Website, CodePen & GitHub

FootGuess | Website

Circlist | Currently in works 🚧


In case you want to try out 100DaysOfCode for yourself, you'll find out more information on the following website (https://www.100daysofcode.com/).

If you liked this article, consider following me on Twitter. I post tips around web development and progress on my projects. If you have any questions, my DMs on Twitter are always open.

buymecookie.png

Top comments (0)