<100 Days Of Code />
Tags: webdev, javascript, career, 100daysofcode
Published: 2021-04-19 13:00:03

**What is '100 Days of Code'?**

Firstly before I get into my journey on the 100 days of code challenge, let me tell you briefly what it is. Essentially it consists of two rules:

1. Code a minimum of one hour a day for 100 days.
2. Tweet your progress every day with the hashtag #100DaysOfCode.

I also incorporated a third rule which isn’t mandatory but I’ve seen some people do, which was to encourage at least two other people also doing the challenge by either liking or commenting on their 100 days of code tweet on Twitter. The purpose of doing the challenge is to create a habit of learning to code, particularly if you are a self-taught developer having to balance work and family life around studying. All information on this challenge can be found on the official website: https://www.100daysofcode.com/

**Committing**

The first step was to publicly commit to the challenge, this way I could have an audience of people to follow my journey and perhaps hold me accountable. I certainly got lots of encouragement and positive messages about my projects along the way, which is one of the best things about tech Twitter. I highly recommend anybody learning to create a Twitter account and join in with the tech Twitter community.

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">I've been coding for 30+ days now but deciding to commit again to <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> so I guess today is officially Day 1! On the agenda today is learning more about asynchronous JavaScript programming on <a href="https://twitter.com/treehouse?ref_src=twsrc%5Etfw">@treehouse</a>, <a href="https://twitter.com/freeCodeCamp?ref_src=twsrc%5Etfw">@freeCodeCamp</a> JavaScript section and learning about local storage.</p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1252610395812122624?ref_src=twsrc%5Etfw">April 21, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

**Setting a Goal**

The world of development is vast and endless, and I felt that it was important for me to set some goals for what I wanted to achieve by taking part in this challenge. My general goal was just to become more proficient with HTML, CSS, JavaScript and to start learning a front-end framework (I later decided on React). I had already decided that I was going to take a more project-based approach to my learning, having previously been a victim to 'tutorial hell'. I'm not ashamed to say that I've struggled previously with building projects, I think this is quite a normal thing for many self-taught developers. So I was determined to build as many projects as I could during this challenge. 

My main goal was to learn React and to create at least one basic project using it. However, I initially started looking into Vue because I'd heard so many good things about it, ease of learning and also how supportive the community is. I also watched an amazing documentary about how [Vue](https://youtu.be/OrxmtDw4pVI) was created by Evan You as literally just a side project. 

I had no idea what to choose but I did some research, and thought about my long-term goals, eventually deciding to learn React but I definitely plan on learning Vue at some point in the future, mainly out of pure interest. I will likely touch on why I chose the React path in a future post but employment prospects definitely played a big part in my decision :-)

I've had a very mixed relationship with React so far, summed up perfectly by this tweet: 

https://twitter.com/dev_avocado/status/1336748986582134784

The early days for me were largely spent working through coding platforms including Codecademy, Treehouse, and Freecodecamp on topics such as Object-Oriented JavaScript, Fetch API, Responsive Web Design, HTML, and CSS. During this time I started listening to podcasts such as Syntax which is a hugely popular podcast for web developers and is hosted by non-other than Scott Tolinski and Wes Bos, two well-known and respected web developers with years of experience.

**Blogging**

I started blogging during this time and by day 15 published my first blog post giving an insight as to where I was and what I was looking to achieve. Check out the post if you haven't already :-)

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Day: 2⃣8⃣ &amp; 2⃣9⃣ <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a><br>- Completed the React basics course on <a href="https://twitter.com/treehouse?ref_src=twsrc%5Etfw">@treehouse</a><br>- Wrote a new blog post: <a href="https://t.co/6jSgftznG7">https://t.co/6jSgftznG7</a><br>- Started learning Bootstrap 4 through Treehouse. Working on a basic landing page site after creating an initial email sign-up form.</p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1263967036994093060?ref_src=twsrc%5Etfw">May 22, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Honestly, the best thing about blogging about this whole experience is was firstly it helped me think about what I had learned and secondly served as a reminder of just how far I've come. Learning to code can feel like a slow burner at times, anything that can help you stay motivated is amazing. My aim is to continue blogging and also blog about more technical concepts once I feel comfortable enough to pass on that knowledge, but for now I'm happy to blog about the process generally. One benefit of this is that I can share this with non-technical people or people who are thinking about making the leap but having done so yet.

**Building**

I mentioned previously, one of the main things I wanted to achieve from participating in the 100 days of code challenge is to build more projects. As any developer will tell you, building projects is where the real learning happens. To use an analogy, working through tutorials is like learning to ride a bike with training wheels. However, at some point those training wheels have to come off, this is where building projects comes in. 

The idea of building a whole project is very daunting to any beginner, but there are many ways to at the very least get started. One thing I started to do more of initially is coding along whilst watching videos of projects being made. I never did this before because to me it seemed like cheating, however, the only person I would be cheating is myself if I didn't make the effort to understand as much of the code as possible. The great thing about coding along to projects is that you can see how a website or application is built from start to finish, the setup, technologies used, how the code is structured and the thought process of the developer working on the project. As a self-taught developer this is really invaluable and from my experience, I found that watching these videos made the process of building websites and applications seem less daunting. 

Development really is just breaking down a larger problem into small parts. Also, working through platforms that are very project focused such as FreeCodeCamp and The Odin Project are really beneficial to giving you that hands-on experience from early on in your learning.

https://media.giphy.com/media/zOvBKUUEERdNm/giphy.gif

### #100DaysOfCode ###

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Day 4⃣3⃣ <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> &lt; <br><br>Learned about programming patterns in React whilst working on a video player project. Really struggled with this one, so will have to revisit this again 😓<br><br>/&gt; <a href="https://t.co/rUhGqWL10V">pic.twitter.com/rUhGqWL10V</a></p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1271492804749987841?ref_src=twsrc%5Etfw">June 12, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Took some time off, as much as it can be enjoyable learning, it's important to be realistic and also think about your health.

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Days 4⃣9⃣ &amp; 5⃣0⃣ <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> <br><br>- Worked on a currency converter app using HTML, CSS &amp; vanilla JS. <br>- Finished the React components section on Treehouse.<br>- Continued learning about HTTP requests on Codecademy and used a Rebrandly API key on a small link shortening project. <a href="https://t.co/SQvmOXuahz">pic.twitter.com/SQvmOXuahz</a></p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1275934555757838337?ref_src=twsrc%5Etfw">June 24, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

There were moments of frustration:

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Days 9⃣0⃣ &amp; 9⃣1⃣ <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> <br>Continued learning how to use GraphQL and also GraphQL Playground, which was really interesting. But annoyingly broke my code and spent most of the day on stack overflow trying to resolve it 🤬 Resolved for now but might come up again 😭</p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1304574004833984514?ref_src=twsrc%5Etfw">September 12, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Ultimately it was worth it and great to finish the challenge:

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Day 1⃣0⃣0⃣🎉 <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> <br>Continued learning React on <a href="https://twitter.com/freeCodeCamp?ref_src=twsrc%5Etfw">@freeCodeCamp</a> and studied some CSS and Sass concepts to use on an upcoming project. Happy to have completed the 100 days of code challenge, looking forward to round 2 and building more projects ☺️ <a href="https://t.co/N2gb6jpp1j">pic.twitter.com/N2gb6jpp1j</a></p>— Lawrence Narh-Lawson (@NarhLawson) <a href="https://twitter.com/NarhLawson/status/1310362275618979845?ref_src=twsrc%5Etfw">September 27, 2020</a></blockquote> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

### What I Learned ###

I learned a lot of new concepts during this challenge, but I was also pleased to have solidified some of the concepts I have previously learned and used in previous projects

* HTML
* CSS
* Bootstrap 4 & 5
* JavaScript
* React
* API's
* Deploying

The project I'm proud of the most is my Codecademy 'Ravenous' project which is a Yelp-like clone built with React which uses the Yelp API to query restaurants and display information based on location.

###Resources###

One of the most important resources I had which gave my learning a great deal of structure was the Create a Front-End App with React path via Codecademy Pro. Codecademy gave out free trials for the pro version of their platform for anyone who had lost their job due to the pandemic. What I especially liked about this was that there was a structured path teaching you all the fundamentals needed, along with quizzes, mini-projects and a final capstone project to finish the path off. I'm definitely someone who favors a structure to my learning, so this was exactly what I needed. I also worked through FreeCodeCamp and Udemy courses mostly.

###What Next?###

I am thinking of potentially doing Round 2 of the 100 Days of Code challenge, however, at this moment in time I usually code most days so maybe I'll do another challenge when I want to learn something specific. The plan, for now, is to carry on learning React as this is still quite new to me and I haven't grasped it as much as I would like. I've also recently started working through the CS50 Introduction to Computer Science, as I want to improve my understanding of fundamental programming concepts. Most importantly, carry on building!