Today's Progress: Microservices and APIs Projects on freecodecamp. Created a URL Shortener Microservice using MongoDB and Node.js. Learnt how to play with GET and PUT action methods to create API endpoints. I didn't work on the FrontEnd though ^ 0 ^
Thoughts: The challenge was tricky and eye opening. Redirecting to the original url from the shortened url was a tussle that kept me stuck for almost 30 minutes only to discover the solution was one line of code.
Link to work: URL Shortener Microservice App
Article(s): Today I read an interesting article "Learn to Code From Home: The Coronavirus Quarantine Developer Skill Handbook " by Quincy Larson the founder of freecodecamp on how to take advantage of the freely available learning resources and level up your Dev Skills during this quarantine period. In the article, he shared a couple of these resources and I will be visiting them in the course of my journey.
Today's Progress: Started and finished the Data Visualization Certification challenges on freecodecamp. I will start working on the projects soon.
Thoughts: I enjoyed learning how to use the D3.js Javascript library. Finally, I learnt how to create a pie chart and bar graph using JS! Also started learning how to use AJAX to work with APIs still on the Data Visualization path.
Link(s) to work: Freecodecamp Data Visualization
Today's Progress: Created a Timestamp Microservice that returns the passed timestamp in JSON format
Thoughts: I had a hard time parsing the unix format and dealing with an empty string in the GET request. Learnt how to work with UTC and Unix timestamps.
Link(s) to work: Timestamp Microservice
Article(s): I also read an interesting article by Jesica Chan on freecodecamp news and learnt about the Tomato Timer promodoro WebApp .
Today's Progress: Created a Request Header Parser Microservice and a File Metadata Microservice - APIs and Microservices Projects - freeCodeCamp
Thoughts: I Learnt how to access contents of a GET API request. Learnt how to use the Multer node.js middleware for handling multipart/form-data used for uploading files. Played with the projects UI too. It was fun coding very late at night. I am only left with one project under APIs and Microservices Certification. I am super excited.
Link(s) to work:
Article(s): Read "I Finished the Entire freeCodeCamp Curriculum in 1 Month (and Recorded Everything)" by Florin Pop. This guy is crazy and amazing too.
Today's Progress: Finished working on the Appointment Booking App FrontEnd using Angular framework as per the tutorial.
Went through the Angular documentation and created the 'Get Started App' - simple e-commerce sample app.
Link(s) to work:
Todays Highlights:
- Learnt about Ignite UI for Angular
- Discovered Stackblitz online text editor
Article
Today's Progress: Created a Binary Calculator and a Button Rotate using Javascript as part of the #10DaysOfJavascript challenge @HackerRank. This meant I had completed the 10 days challenge and earned a Gold Badge (five stars). Another badge in my bag <^_^> :)
Thoughts: Finally learnt and understood the CSS Flexbox concept Css-Tricks. I feel well equipped now! Chris Coyier has always been a consistent inspiration in my Web Development journey. I also stumbled upon Canvas concept W3Schools and set up a clock project that I will continue to build on the way.
Link(s) to work:
Article
- [A Complete Guide to Flexbox](Link: https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
Today's Progress: Created an Exercise Tracker, last challenge @freeCodeCamp APIs and Microservices Certifcation.
Thoughts: Bugs are real! I will relook the APIs endpoints to pass the freeCodeCamp tests though the app is working as expected.
Link(s) to work:
Article Read MDN Web Docs - Javascript. "JavaScript — Dynamic client-side scripting"
Today's Objectives:
- continue with Angular
- finish on Exercise tarcker
Today's Progress: Went through some CSS flexbox concepts freeCodeCamp and practiced. Finally concluded the Exercise Tracker mii project and eraned the APIs and Microservices Certificate after a tussle. ^ _ ^ ' _ ' ;) Today I also came up with the whole #100DaysOfCode challenge objectives to guide me along the way. I am super excited.
Certificate: APIs and Microservices Certificate
Link(s) to Work:
Article: "Want to Improve Your Coding Skills? Join the #7Days7Websites Coding Challenge" by Florin Pop @freeCodeCamp
Today's progress: Set up and started the Microverse Pre-Course Work. It is basically a Web Development curriculum/training at the Odin Project Platform and vowed to dedicate 10hours/week to the program. I will apply for the Pair Programming Practice sessions next.
Link(s): https://www.theodinproject.com/courses/web-development-101?ref=lnav
Revisited the Intermediate Javascript Algorithms challenges freeCodeCamp to expound my knowledge-base(KB). I am close to earning the 3rd FreeCodeCamp certficate.
Articles/Resources: Man, today I came across very many articles/writings and most of them enlighted me and triggered my brain to think differently. I will just drop the links here. you can visit them anytime you find time to do so.
-
http://blog.udacity.com/2014/12/front-end-vs-back-end-vs-full-stack-web-developers.html
-
http://www.vikingcodeschool.com/posts/why-learning-to-code-is-so-damn-hard
-
http://joshuakemp.blogspot.co.uk/2013/11/how-blacksmith-learned-to-code-and-9.html
-
https://www.ted.com/talks/carol_dweck_the_power_of_believing_that_you_can_improve
-
https://www.ted.com/talks/angela_lee_duckworth_the_key_to_success_grit
-
https://medium.freecodecamp.org/learning-to-code-when-it-gets-dark-e485edfb58fd#.yjh0fehje
-
https://www.vikingcodeschool.com/posts/why-learning-to-code-is-so-damn-hard
Objectives:
- Revisit and complete John's project
- Complete Odin Frontend project(Google landing page)
- FreeCodeCamp Intermediate challenges
- Day 8 project: Visualize Data with a Bar Chart
- Look for angular mini project and set up
Today's progress:
Created an analog Clock using HTML Canvas.
Revised, completed and delivered a colleague's work.
Set up "Visualize Data with a Bar Chart" - freeCodeCamp Data Visualization project. This mini-project uses the D3.js Javascript library.
Article:
Objectives:
- HackerRank 30 Day Challenge
- Odin Project
- FreeCodeCamp practice
- Angular
Today's Progress: Completed the warm up Algorithms at Hackerank and earned my second star.
Objectives:
- Start working on an Angular Dashboard
- Hackerank 30 Day Challenge
- Mini Article
Today's Progress: Started working on an Angular dashboard using Material CSS, Flexbox and HighCharts.
Wrote my first kamini Medium blog about COVID-19 dashboards.
Highlights: Discovered Bootstrap Table used to create amazing tables with myriad functionalities
Articles: I have been yearning to create a COVID-19 dashboard using Angular 8 and reading this article inspired me even more. "I've open-sourced a simple Coronavirus (COVID-19) dashboard (React + Chart.js + BootstrapTable)" by Oleksii Trekhleb
"16 front-end projects (with designs) to help improve your coding skills" by Matt Studdert 2. https://dev.to/frontendmentor/16-front-end-projects-with-designs-to-help-improve-your-coding-skills-5ajl
"Kaggle’s 5 remote-first tips for new WFHers" by Megan Risdal 3. https://dev.to/mrisdal/kaggle-s-5-remote-first-tips-for-new-wfhers-3a4g
Objectives:
- Proceed with Angular dashboard
- Create an Angular Note Keeper mini App
- Hackerank 30 Day Challenge
Today's Progress: Created a Note Keeper mini-App using Angular and Bulma. Learnt how to use Bulma CSS framework and practiced Sass. To implement back end tomorrow. Completed Hacker rank 30 Day Challenge Day 10 challenge.
Article: "Version 9.1 of Angular Now Available — TypeScript 3.8, faster builds, and more"
Objectives:
- Continue with Angular Notes mini app
- Hackerank 30 Day Challenge, Day 11-2D Arrays
Today's Progress:
Completed the Hackerank 30 Day challenge, Day 11 - 2D Arrays. Added/Finished the CRUD operations in the Angular Notes App. Technologies: Bulma CSS, SCSS, Angular 8 Learnt how to build and deploy an Angular App on Google Firebase.
-
Project URL: https://angular8-notes-app.web.app/
-
GitHub link: https://github.com/erickarugu32/Notes-App-Angular
Highlights:
Today I successfully built an Angular mini-app for production and deployed it on Firebase. link: https://angular8-notes-app.web.app/
Articles:
"Deploying an Angular App to Firebase Hosting" from https://alligator.io
Top Website for Web Development articles
- Link: https://alligator.io
Objectives:
- Hackerank 30 Day Challenge, Day 12 Inheritance
- Angular course on Pluralsight
Today's Progress:
Hackerrank 30 Day Challenge - Day 12 Class Inheritance Problem
Completed the >1hour "Angular: The Bigger Picture" by Joe Eames course on Pluralsight.
Completed 35% of "Angular: Getting Started" >5hrs code-along course by Deborah. Her explanation of the course content is something else. I didn't even realize I had sat down for over 3hrs without taking a break. She made me understand the building blocks of the Angular framework. This made me love it even more :) Eagerly waiting for tomorrow...
- Code-Along project URL: https://github-ymlavq.stackblitz.io/
- Github repo link: https://github.com/erickarugu32/github-ymlavq
Highlights:
Took advantage of the free access to Pluralsight expert-led learning videos. Learnt in-depth Angular concepts thanks to Jon Eames and Deborah Kurata for their amazing courses on Pluralsight.
Articles:
Today I went through a couple of articles under Angular and CSS sections in the alligator site. These are the ones that really stood out for me:
-
"Component Communication in Angular" by Hanish Totlani Link: https://alligator.io/angular/component-communication/
-
"Styling Scrollbars with CSS: The Modern Way to Style Scrollbars" by William Le Link: https://alligator.io/css/css-scrollbars/
-
"How to Use the CSS: root Pseudo-Class Selector" by William Le Link: https://alligator.io/css/root-pseudo-class/
-
"JavaScript Algorithm: Grading Students" by Erica N Link: https://medium.com/javascript-in-plain-english/javascript-algorithm-grading-students-210a89c5496f
Objectives:
- Hackerank 30 Day Challenge, Day 14 Abstract Class
- continue with "Angular: Getting Started" course on Pluralsight
Today's Progress:
I completed the Hackerrank 30 Day Challenge - Day 14 Abstract. Completed the "Angular: Getting Started" course by Deborah Kurata on Pluralsight. Learnt and understood in depth Angular concepts:
- Strong typing
- Life cycle hooks (OnInit, OnChanges, OnDestroy)
- Building Custom Pipes using the @Pipe decorator
- Building Nested Components and Passing Data to and from it
- Service and Dependency Injection
- Retrieving Data using Http ()Observables and Reactive Extensions
-
Code-Along project url: https://github-ymlavq.stackblitz.io/
-
Github repo link: https://github.com/erickarugu32/github-ymlavq
Highlights:
I am now comfortable solving the Hackerrank challenges without referring that much. I now feel confident enough to handle a fully functional Angular App. I also got the Moringa Campus Ambassador role - to receive the contract next week. It's somehow sth big considering the intense and long application/interview process but I did not feel excited at all.
Articles:
-
"How to get your first job as a self-taught developer" by Virginia Balseiro https://www.freecodecamp.org/news/how-to-get-your-first-job-in-tech/
-
"How to Build a Piano Keyboard Using Vanilla JavaScript" by Joe Liang https://www.freecodecamp.org/news/javascript-piano-keyboard/
-
"How to build a PWA from scratch with HTML, CSS, and JavaScript"by Ibrahima Ndaw https://www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/
-
This developer's story was the best thing I read today. Long but captivating and really worth the time! "How I Won my First Ever Hackathon – 2 Wild Days of Research, Design, and Coding" by Moshe Siegel https://www.freecodecamp.org/news/how-i-won-the-hackathon
Objectives:
- Hackerank 30 Day Challenge, Day 14 Abstract Class
- Continue with "Angular: Getting Started" by Deborah Kurata course on Pluralsight
- Create a Twitter bot using Node.js and Twit library to retweet and like given hashtags at set time intervals. Deploy it on Heroku.
Today's Progress:
Completed the Hackerrank 30 Day challenge - 2D Arrays Completed the "Angular: Getting Started" course. Understood various Angular concepts: - Navigation and routing (configuring routes) - Angular modules - Building Test and Deploying with the CLI
Twitter Bot - Hit a set back with Twitter Developer account application. I will continue trying though.
- Stackblitz project link: https://github-ymlavq.stackblitz.io
- GitHub repo: https://github.com/erickarugu32/github-ymlavq
Highlights:
Understanding angular concepts.
Articles:
-
“8 Timeless Skills to Learn Now in Under 8 Hours to Change your Life Forever” @danny_forest https://link.medium.com/mWoVsBVeq5
-
"Create A REST API With JSON Server" by Sebastian Eschweiler https://medium.com/codingthesmartway-com-blog/create-a-rest-api-with-json-server-36da8680136d
-
"Simplify your JavaScript - Use .map(), .reduce(), and .filter()" by Etienne Talbot https://medium.com/poka-techblog/simplify-your-javascript-use-map-reduce-and-filter-bd02c593cc2d
Objectives:
- Hackerank 30 Day Challenge, Day 16 Abstract Class
- Complete Angular Form course by mark Zamoyta on pluralsight
Today's Progress:
Completed the hackerrank 30 Day challenge - Day 15 Linked List link; https://www.hackerrank.com/challenges/30-linked-list/problem
Completed the Angular Form course on Pluralsight. Learnt and understood angular forms concepts: - Reactive forms vs template driven forms - Form validation - Data Binding - Posting data using HttpClient - 3rd party controls to enhance form controls
GitHub link: https://github.com/erickarugu32/ps-demo
Articles:
- I noticed my Vs Code color theme sucks, went searching and found this read. "50 VS Code themes for 2020" by GEoff Steens
Link: https://dev.to/thegeoffstevens/50-vs-code-themes-for-2020-45cc
Objectives:
- Hackerank 30 Day Challenge, Day 16
- Covid-19 Dashboard
Todays Progress:
I Started working on Covid-19 dashboard using Angular 8, Bootstrap-4, and Hichcharts. I Createed the UI, Data cards and Table components.
Completed the Hackerrank 30 day day 16 challenge - Exceptions -Trsiing to INteger
Objectives:
- Hackerank 30 Day Challenge, Day 17 More Exceptions
- continue Covid-19 Dashboard
Progress:
I went through "javascript Sntax and Operators" course by Paul D. Sheriff on Pluralsight and got answers around Javascript Objects' question that have been in my mind for quite some time.
I created a One-city(Nyeri) weather app ultilizing JSON and AJAX and getting data from OpenWeatherData API. I hosted the not complete Mini Web-App on Github pages.
1.link: https://erickarugu32.github.io/Weather-App/
Highlights:
I finally understood the Javascript "this" keyword thanks Paul D. Sheriff on Pluralsight.
Articles:
Mmm I found this article and it was amazing despite the writer claiming it was her first one. "#100DaysOfVanillaJS: What is JavaScript, Primitive Data Types & Let, Var and Const" by Tae'lur Alexis on DEV
Objectives:
- Hackerank 30 Day Challenge, Day 18 Queues and Stacks
- Start working on a WebApp with colleagues
Todays' Progress:
I started working on a promising private project with some amazing colleagues. Looked into registration and authentication concepts in Angular 8. Followed the tutorial from this page - "Angular 7 Tutorial Part 4 - Login Form, Authentication Service & Route Guard" by Jason Watmore
Articles:
- "Acing the JavaScript Interview: top questions explained " by Amanda Fawcett
link: https://dev.to/educative/acing-the-javascript-interview-top-questions-explained-59b7
- Coding Interview: https://www.codinginterview.com/
https://www.educative.io/courses/javascript-interview-handbook
Objectives:
- HackerRank Day 19 Challenge -Interacting with Interfaces
- Next projects preparation
- Continue with Javascript Syntax and Operators cours on Pluralsight
Todays Progress:
Completed the HackerRank problem.
I went through must have developer tools in preparation for the next project. I did a design refresher using css to create stunning diagonal layouts.
Articles:
-
"CSS Foldable Display Polyfill " by Chris on CSS_TRICKS link: https://css-tricks.com/css-foldable-display-polyfill/
-
"Create Diagonal Layouts Like It's 2020" by Nils Binder. link: https://9elements.com/blog/pure-css-diagonal-layouts/
Objectives:
- Hackerank 30 Day Challenge, Day 20 - Sorting(Bubble Sort)
- Practice CSS flex concepts
- Create a Sunset Tracking App - Weather API
- Complete "JavaScript Syntax and Operators" course on Pluralsight
- Write a mini article
Today's Progress:
Learned about the spread operator in Javascript including how, when and where to apply it finishing the "Javascript Syntax and Operators" course by Paul D. Sherrif on Pluralsight
Completed Hackerrank Day 20 - Sorting challenge.
Practiced CSS Flexbox concept thanks to Gary Simon for his course "CSS Flexbox Fundamentals" on Pluralsight. Designed the TomatoTimer promodoro UI using the CSS flex concept. (responsive UI design output attached. Created in CSS and HTML only)
Official tomato timer promodoro: https://tomato-timer.com
Articles:
Call(), Apply() and Bind() functions.
-
"Javascript Function Methods: Call vs Apply vs Bind" by Jonathan Hawley-Peters link: https://medium.com/@jhawleypeters/javascript-call-vs-apply-vs-bind-61447bc5e989
-
"How To Swap Two Values Without Temporary Variables Using JavaScript" link: https://medium.com/better-programming/how-swap-two-values-without-temporary-variables-using-javascript-8bb28f96b5f6
Objectives:
- Hackerrank Challenge Day 21 - Generics
- Finish working on the weather app
- Begin #7Days7Websites Challenge
Todays' Progress
Completed Hackerrank Day 21 Challenge - Generics.
I finished working on the mini Weather App by adding the City search functionality. Enter any city name to see current weather conditions and three days forecast.
Practiced the CSS flexbox concept by tackling two design challenges at @frontendmentor: a landing page, and a single-price grid component using pure CSS. No framework. 3 Designs in one day! There is no better way to kick off the 7Days7Websites challenge
- link: https://erickarugu32.github.io/Weather-App/ #7Days7Websites
- link 1: https://single-price-grid-component-omega.now.sh
- link 2: https://huddle-landing-page-git-master.erickarugu.now.sh
Articles:
-
"Thinking in Behaviors, Not Screen Sizes" by Robin Rendle on CSS-Tricks link: https://css-tricks.com/thinking-in-behaviors-not-screen-sizes/
-
"Tips for Writing Animation Code Efficiently" by Zach Saucier on CSS-Tricks link: https://css-tricks.com/tips-for-writing-animation-code-efficiently/
Objectives:
- Hackerrank day 22
- CSS Flexbox and Bootstrap 4 course on Pluralsight
- #7Days7Websites Challenge - Day 2
Todays' Progress:
Completed Hackerrank Day 22 Challenge -Binary Search Trees. Practiced working with Stacks and Queues. Learnt how to implement Google Sign-In (OAuth) in an Angular App.
Articles:
-
"How to build an Angular 8 app from scratch in 11 easy steps" by Ahmed Bouchefra link: https://www.freecodecamp.org/news/angular-8-tutorial-in-easy-steps/
-
"Implement Google Sign-In(OAuth) in your Angular App in under 15 minutes " by Siddharth Ajmera link: https://dev.to/angular/implement-google-sign-in-oauth-in-your-angular-app-in-under-15-minutes-1ebo
Objectives:
- Hackerrank Day 22 & 23
- Did 2nd #7Days7Websites Challenge design
- Continue with Angular project (login,sign in and authentication functionalities)
Todays' Progress:
Completed Day 22 and 23 Hackerank Challenges- BST and BST Level-Order Traversal. Practiced Angular CLI commands for effective Angular App development from "Angular CLI" course by John Papa on Pluralsight. Designed a pricing component with a toggle button for my 2nd #7Days7Websites Challenge from @frontendmentor
Articles:
-
"How to Handle Errors in Angular Reactive Forms With 3 Lines of Code" by Klement Omeri link: https://dev.to/klementomeri/how-to-handle-errors-in-angular-reactive-forms-with-3-lines-of-code-3nan
-
"How I'm Learning to Code and How You Can Too" by Ceora Ford link: https://dev.to/ceeoreo/how-i-m-learning-to-code-and-how-you-can-too-1epb
-
"Responsive Media Designs: Setting CSS Breakpoints" link: https://www.bitdegree.org/learn/responsive-media
Objectives:
- Hackerrank Day 24
- #7Days7Websites Challenge Design
- Continue with Angular project (browse jobs page, registration logic, header/navbar)
Todays' Progress:
Completed Hackerrank day 24 challenge. I designed a digital clock with plans of making it a useful full project. I practiced recursive functions in Javascript.
Articles:
"How I went from stay-at-home-mum to landing my first web developer job" by Phoebe Voong-Fadel
Objectives:
- Hackerrank Day 25 - Running Time Complexity
- #7Days7Websites Challenge design
- Continue with Angular project
Todays' Progress:
I completed Hackerrank day 25 challenge - Running Time and Complexity (4 more days to go) Practiced functional programming challenges at freeCodeCamp(50% done) I designed a simple intro component with a sign-up form - challenge from frontendmentor
link: https://github.com/erickarugu32/intro-sign-up link: https://intro-sign-up.now.sh/
Articles:
- "Ride Down Into JavaScript Dependency Hell" by Nikola Duza link: https://dev.to/appsignal/ride-down-into-javascript-dependency-hell-39b0
Objectives:
- Hackerrank Day 26 - Nested Logic
- #7Days7Websites Challenge design
- Continue with Angular project
- Odin Frontend project
Todays' Progress:
I completed the @hackerrank day 25 challenge - Nested Logic.
Worked on a simple project to show the distribution of #Covid19 cases by counties here in Kenya making use of @LeafletJS library NB: => { data !accurate } => no API available so far.
Articles:
- "Examples of Map, Filter and Reduce in JavaScript" by Tania Rascia on her amazing website link: https://www.taniarascia.com/real-world-examples-of-map-filter-and-reduce-in-javascript/
Objectives:
- Hackerrank Day 26
- #7Days7Websites Challenge design
- Continue with Angular project
- Javascript (Functions and Classes)
Todays' Progress:
Completed "JavaScript and AJAX: Integration Techniques" course on linkedIn. Continued with Javascript special functions(filter(), map(), sort(), reduce() etc..) Designed, developed and completed a one page Corona Virus awareness project:
- live link: https://covid-data-xi.now.sh
- repo: https://github.com/erickarugu32/Covid-Data
- github pages: https://erickarugu32.github.io/Covid-Data/
Articles:
-
"What is Computer Programming? Defining Software Development." by Phoebe Voong-Fadel link: https://www.freecodecamp.org/news/what-is-computer-programming-defining-software-development/
-
"https://www.freecodecamp.org/news/set-future-you-up-for-success-with-good-coding-habits/" by Colby Fayok link: https://www.freecodecamp.org/news/set-future-you-up-for-success-with-good-coding-habits/
Objectives:
- Hackerrank Day 27
- #7Days7Websites Challenge design
- JavaScript (Objects and Constructors)
Today's Progress:
I completed Hackerrank day 26 and 27 Challenges. I practiced working with XHR to make http requests and dynamically update web pages using the jQuery plugin. Learnt how to work with bootstrap 4 tables https://bootstrap-table.com
Articles:
- "Angular pages with dynamic layouts" by Michael Lazarski => DEV
Read an article about the new Angular 9 features by Andres Gallo. I will put the knowledge to work as soon a kplc decide to behave. Link: https://www.morioh.com
Objectives:
- Hackerrank remaining challenges
- #7Days7Websites Challenge design
- Continue with Angular project
- Javascript (Advanced functions)
Todays' Progress:
Completed 15% Angular Fundamentals course by Jim Cook and Jea Aames on Pluralsight learning and practicing how to set up an angular application on any platform.
Articles:
- "How I Went from Sales to Front End Developer in 16 Months" by Braedon Gough => FreeCodeCamp
- "Want to Know How to Get a Remote Job? I Asked 30 Remote Companies - This is What They Said" by Rauno Metsa => FreeCodeCamp
Today, I also stumbled into(online though) this remote solo developer behind remotehub.io. This is his side project as he continues to work for a remote company from home. His novel idea of providing a platform where remote developers can connect with companies hiring remotely is slowly starting to pay off.
- "Dark theme for (almost) everything" by Thiago Braga on DEV
Objectives:
- Continue with Angular project
- Angular CLI tools
- Javascript (Advanced functions)
Todays' Progress:
Completed 30% Completed 15% Angular Fundamentals course by Jim Cook and Jea Aames on Pluralsight. Completed "JavaScript Variables and Types" JS intermediate course by Barry Luijbregts on pluralsight. Practiced writing clean and maintanable code by fully utlizing what JS variables and Data types has to offer. Started working on a full angular side project to help cement all the angular fundamentals I have learnt so far.
Articles:
-
"Angular 9 for Beginners — How to install your first App with Angular CLI?" by Cem Eygi on freeCodeCamp
-
"How to Make a Website SEO-Friendly and Keep it That Way" by Adam Henson on freeCodeCamp
Objectives:
- Angular Fundamentals course
- Working with Javascript Modules
Todays' Progress:
Completed the "Working with Javascript Modules" Javascript course by Jonathan Mills on pluralsight. Learnt how to create and export modules using different conventions(named, default and aggregating). Leanrt how to enable, import and use imported modules.
Articles:
- "Permutation and Combination: The Difference explained with formula example" by Alexander Arobalidze on freeCodeCamp
- "Dear Developers: Please Share your Story. We Could All Learn from Each Other's Coding Journeys." by Braedon Gough on freeCodeCamp
- "Backend Software Architecture Checklist: How to Build a Product from Scratch" by Sajal Sharma
Objectives:
- Angular Fundamentals course
- JS Objects and Prototypes, Error handling and Runtime => javascripttutorial.net
- Build a Trivia Quiz App with HTML, CSS, and Javascript
Todays' Progress:
Completed the "Javascript: Functions" course by Prateek Parekh on Pluralsight. I learned how to effectively use the call(), apply() and bind() methods and construction of rest and spread parameters. Built a Quiz App with HTML, CSS, and Javascript following a course by James Q Quick on Udemy. I learned how to employ very many JS concepts I have garnered along the way(map, filter, sort, fetch, DOM manipulation, JSON)
Articles:
-
"Let’s code a dribble design with Vue.js & Tailwindcss (Working demo) — Part 1 of 2" by Fayaz Ahmed on Dev
-
"The Framework for Perfectionists With Deadlines" by Velda Kiara on Dev
Objectives:
- Angular Reusable Services, Routing and Navigating Pages
- JavaScript Classes, Prototypes
Todays' Progress:
Today I finally completed the Functional Programming exercises at freeCodeCamp under Javascript Algorithms and Data Structures Certification after postponing since last year. Continued with Angular Fundamentals course on PluralSight and the events app. Dived deep into Angular Template Syntax, Creating Angular services and adding the routing functionality. Learnt about toastr js library and how to use it as a 3rd party service in an Angular app.
repo: https://github.com/erickarugu32/angular-events-app
Articles:
"Don’t use for loop for JavaScript Arrays" by Kushal Sharma on DEV
"Creating a JavaScript Function to Calculate Whether It's a Leap Year" by Nick Scialli <= A very short and sweet article. Left me wondering whaaat?
Objectives:
- Angular Routing and Navigating Pages
- AJAX and PHP Scripts
Todays' Progress:
Today I went through the process of connecting a JS client-side with a PHP script backend with the AJAX technology/technique using the XHR Web API and MySQL as the preferred database. I finally learned how PHP ad JavaScript can coexist on the same project. I also played with the Bulma CSS framework and honestly, I still don't know how I feel about it.
Articles:
"If you use fetch() to make Backend API calls, you need to read this" by Swapnil Devesh on DEV "5 Steps to publish my first npm package" by Alba Silvente on DEV "Javascript Frameworks that will rock this year!" on DEV "Facing impostor syndrome and time management issues" by Leonardo Faria on freeCodeCamp
Objectives:
- JavaScript Arrays and Collections on Pluralsight
- Update the Covid 19 dashboard with charts
Todays' Progress:
Completed the "TypeScript: The Bigger Picture" course by Simon Allrdice on Pluralsight. Learnt about the three major benefits of using Typscript(i.e Static typing, Tooling and Organization) => will consider using it in my next big projects. Completed the "Javascript and Collections" course by Jeff Batt on Pluralsight. Learnt how to work with chartjs library, Sets, Maps and Data Collections as well as an intro in Typed Arrays. I added a doughnut chart on the dashboard and improved on the visual design.
live: https://covid-data-xi.now.sh
Articles:
- "How to create pure CSS illustrations and animate them - Part 1" by Agathe Cocco on Dev
- "Don't miss out on CSS variables" by Tim Deschryver on DEV
- "How to center elements with CSS" by Naveen Kharwar on DEV
Objectives:
- Continue with Angular Routing and Navigation
- Javascript Objects continuation
Todays' Progress:
I continued looking at/practicing JS Objects and Prototypes including patterns for creating objects and prototypal inheritance.(JS Prototype is a tricky and crucial concept that every Developer must understand => javascripttutorial.net). I continued wit the Angular Events app. I created a data service, configured routes and created a route guard service. I was excited to do develop these parts with a clear understanding and planning without much referencing which is a great milestone for me.
Articles:
- "Difference between ActivatedRoute and ActivatedRouteSnapshot in Angular" link: https://www.geekboots.com/story/difference-between-activatedroute-and-activatedroutesnapshot-in-angular
Objectives:
- Continue with Angular Routing and Navigation
- Product Management Masterclass - How to Build Digital Products
Todays' Progress:
I completed >50% of the Product Management Masterclass - How to Build Digital Products. It's not directly related to coding but the skills taught here are a must-have, plus it's on a 100% discount. I learned how to create a feature module with full functionality including the routes and implemented o the Angular Events practice app.
Articles:
-
"5 npm Tips and Tricks to Help You Boost Your Productivity" by Niall Maher on freeCodeCamp
-
"650+ Free Online Programming & Computer Science Courses You Can Start This May" by Dhawal Shah on freeCodeCamp
-
"Increase Your Chances Of Getting Hired As A Code Newbie " by Catalin Pit on his website link: https://catalins.tech/increase-your-chances-of-getting-hired-as-a-code-newbie
Objectives:
- Javascript Promises and Async Programming by Nate Taylor - Pluralsight
- Angular Forms Angular Fundamentals - Continue with the events app
Progress:
I learnt about working with Promises and async/wait thanks to course on the same by Nate Taylor on pluralsight. I refactored my weather app to use the asyn & wait approach for better performance.
live: https://erickarugu32.github.io/Weather-App/
Articles:
-
"How To Start and Finish a Side Project " by Harrison Reld on DEV
-
"How to Learn to Code" by Eric Elliott on Medium
-
link: https://medium.com/javascript-scene/how-to-learn-to-code-9f5803506bac
-
"Image optimization for web" by Anton Garcia Diaz on freeCodeCamp
Objectives:
- Continue with Angular Services
- Bulma CSS Framework practice
Progress:
I continued playing with Angular Services. I understood how to configure Dependency Injection in Angular using different methods. I played with Bulma CSS, learning how to couple it with minimal custom CSS to create amazing designs in a very short time and with minimal effort. I continued refactoring the Weather App, fixing loading bugs, and server errors for smooth data rendering and User Experience.
Articles:
- "Reflections on my first 1,000 hours learning to code" by Peter Higgins on Medium
- "10 Awesome Github Repos Every Web Developer Should Know" by Simon Holdorf on Medium
Objectives:
- Start working on the DigiTol Website - 10 Full Websites Challenge
- JS Functional Programming practice
- Practice UI Design @Figma - the best free UI design platform on the web!
Today:
I went through JS functional programming concepts and techniques, completing 50% of the "JS Fundamentals" course on @pluralsight before they ended the free subscription. I also decided to refresh my design skills & designed a website for a fictional company on @figmadesign
Articles:
"Earn a Free Oracle Cloud Certification Using This Free 3-Hour Course (Before May 15th)" by Andrew Brown on freeCodeCamp "CSS Background Image Size Tutorial – How to Code a Full Page Background Image" on freeCodeCamp "Ace your first year as a junior developer with this advice" on Medium
Tools/Resources I found Useful Today:
- https://logomakr.com/ => Free & Instant Logo Maker
- https://www.figma.com/ => Free UI Design platform
- [https://undraw.co => Free and Customizable SVGs](https://undraw.co => Free and Customizable SVGs)!
- https://www.exampro.co/choose-an-exam => Best Stop for professional training courses on AWS Certification Exams (Not entirely Free but they have some courses for free o YouTube)
Objectives:
- HTML5, CSS3 refresher
- DOM Manipulation
- Continue with Figma Design
Today:
I did multiple HTML5 and CSS3 practice questions on Sololearn. It turns out there are a lot of new features introduced in both HTML5 and CSS3 that litereally nobody talks about. I earned the two certificates easily without much trouble. Practiced setting up a Vanilla JS application with Bulma and Sass.
Articles:
-
"Let's sort with JavaScript " by Yaser Adel Mehraban on DEV
-
"The State of Angular in 2019" by Eden Ella on DEV
Objectives:
- Data Structures and Algorithms refresher
- DOM Manipulation
Today:
I went through some Data Structures concepts - Abstract Data Type, Complexity Analysis (The Big-O Notation), Static and Dynamic Arrays. It was an amazing refresher!
I practiced stack and queue implementation using Javascript and I loved it.
Articles:
"Things to learn before learning a JavaScript framework" on Medium
"Coding Practices Our Teammates Will Thank Us For" by John Au-Yeung on DEV
Objectives:
- CSS Refresher - Landing page Redesign
Today:
I decided to design a McDonald's simple landing page using CSS. I finally nailed creating a responsive navigation header.
Article:
"20+ PROJECTS YOU CAN DO WITH JAVASCRIPT" by Scott Morris at SkillShare link: https://skillcrush.com/blog/projects-you-can-do-with-javascript/
Objectives:
- Javascript Intermediate Algorithm Scripting => freeCodeCamp
Today:
I finally completed all the Intermediate Algorithms scripting challenges and the final project (Cash Register) at freeCodeCamp earning my 3rd freeCodeCamp certificate (Javascript Algorithms and Data Structures)
Articles:
"Fibonacci sequence algorithm in Javascript" by devlucky on Medium
"How to Remove Array Duplicates in ES6" by Samantha Ming on Medium
Objectives:
- Regular Expressions in JavaScript
Today:
I practiced forming advanced Regular Expressions in JS. I created a sample Random Password generator. I still do not understand how it took me more than 5 hrs to complete it.
Articles:
I came across this regex guide today:
- "A guide to JavaScript Regular Expressions" link: https://flaviocopes.com/javascript-regular-expressions/
Objectives:
- CSS Position refresher
- Working with jQuery (I know it's kinda outdated but why not)
Today:
I did a CSS Position refresher - Absolute, Relative, Fixed, Sticky, Static. Learned how to work with jQuery to create a responsive design with cool animations.
Highlights:
I am halfway through the challenge, today being the 49th day and I am happy because it is also the day that I got a chance to work on a paying mini project/website. This gave me the motivation to continue leveling up my skills.
Article:
I went through a couple of amazing articles on freeCodeCamp:
- "Flex vs Grid" by Javascript Teacher
- "What is a Senior Developer and how can I become One?" by Colby Fayock
- "How to Write Proposals That will win Over freelance clients" by Kyle Prinsloo
- "HTML Background Color Tutorial – How to Change a Div Background Color, Explained with Code Examples" by Sarah Chima Atuonwu
- "How to Become an Unreal Automation Expert" by Tim Grossman
- "How and WHy to Incorporate AI into Web Development" by Roger James
Objectives:
- Working with D3.js library
- Making HTTP requests in Angular
Today:
Set up an angular project and configured the basis logic. Learnt how to make http requests in Angular. Explored Firebase Authentication, Hosting and Storage services.
Articles:
-
"How to Automate Your Blog Post Publishing Process with Typescript" by TK on freeCodeCamp
-
"I Moved Abroad to Work for a Startup – and I Came Back with Nothing, and Everything." by Kim Thuy Tu on freeCodeCamp
Objectives:
- Working with D3.js library
- Continue on the angular project
Today:
Came back from a well deserved one daybreak. I played with the D3.js visualization library and started working on the first Data Visualization freeCodeCamp challenge. Continued with the client website project. Codepen: https://codepen.io/ericko12/pen/mdeKZEE
Articles:
-
"How to Write Proposals That Will Win Over Freelance Clients (Free Download)" https://www.freecodecamp.org/news/free-web-design-proposal-template/
-
"Asking Effective Questions: A Practical Guide for Developers" by Bolaji Ayodeji
-
"How I Built My Own Forecasting Tool Using a Weather API" by Anton Lawrence on freeCodeCamp
Objectives:
- Continue ith d3.js library
- Continue with freeCodeCamp chalenges
Today:
Repeated all the freeCodeCamp d3.js library related challenges and continued with the Bar Graph Visualization project. The D3 library is quite intimidating at first but I am working very hard to nail it soon.
Articles:
-
"20 Awe-Inspiring Codepen Examples You Can Learn From" by Frontend Dude on DEV link: https://dev.to/frontenddude/20-awe-inspiring-codepen-examples-you-can-learn-from-1kea
-
"I built a members' area on my website with Python and Django. Here's what I learned." by Nick McCullum on freeCodeCamp
-
"How to Understand RxJS Operators by Eating a Pizza: zip, forkJoin, & combineLatest Explained with Examples" on freeCodeCamp
Objectives:
- High Order JS Functions (Map, FIlter, Slice)
- Continue with D3. js Library
Today:
Continued playing with the D3.js library. Designed and developed two website pages using Bootstrap 4.
Articles:
I went through a couple of atricles on freeCodeCamp
- "How to Write More Effectively and Develop Your Unique Style" by Colby Fayock
- "Why I Believe Deno is a Step in the Wrong Direction for JavaScript Runtime Environments" by Mehul Mohan
- "JavaScript Array of Objects Tutorial – How to Create, Update, and Loop Through Objects Using JS Array Methods" by Ondrej Polesny
- "How to Stay Motivated to Keep Learning to Code" by Adrian Twarog
- "A Developer's Guide to Website Speed Optimization" by Digvijay Singh
Objectives:
- WebApp Theming
- Angular Firebase
Today:
I learned and practiced how to take advantage of the new CSS Variables concept to create and toggle different themes for the same App. I learned and practiced how to easily make an Angular app PWA.
Articles:
- "How to Crack the Google Season of Docs Application Process for 2020" by Edidiong Asikpo on freeCodeCamp
- "Open Source contributions: A catalyst for growth." by Edidiong Asikpo
- "GSOD Project Report: Modernize (rewrite) the VLC user documentation" by Edidiong Asikpo on medium
Objectives:
- Continue with Angular Firebase Practice
Today:
Continued playing with Angular Firebase implementation. Designed a mini app to start working on using Angular and Firebase.
Articles:
"How I got my first job as a junior developer at 40+ of age after 6 months?" by Luc_C on DEV.to
"Why I fell in love with tailwindcss" by Martin Beierling on DEV.to
Objectives:
- Angular Firebase Authentication
- Firebase Services
Progress: Continued learning how to effectively set up Angular Firebase in an Angular App. Started playing with the Firebase services (Storage, Hosting, Databases..)
Articles:
- "Legacy Code Tips – How to Take Over an Existing Project and its Codebase" by Milecia McGregor on freeCodeCamp
Objectives:
- Continue with Angular Firebase mini-project (Authentication and initial set up)
- Work with Bulma
Progress:
I started working on my full Angular-Firebase Application - Complimentr(a platform to anonymously leave a compliment for a colleague). I completed setting up the login and registration authentication using email+password and, Google. Continued learning how to effectively work with Bulma, I wrote no custom CSS at all!
Articles:
- "Reloading Components when a change in Route Params — Angular" by Vivek m on medium
- " Angular Detecting Route Changes Within Your Application" by Elliot Forbes on tutorialedge.net
- "Full Angular 7|8|9 Firebase Authentication Tutorial Examples" link: https://www.positronx.io/full-angular-7-firebase-authentication-system/
Objectives:
- Continue with Angular Firebase mini-project
Progress:
Continued working on the firebase authentication functionality - Complimentr
Articles:
- "How I turned my laptop into a server" on DEV.to
Objectives:
- Continue with Angular Firebase mini-project
Progress:
Today, I made a huge progress on the Angular-Firebase mini app. I completed the write and read firebase set up and implementation. In the process I learnt how to create firebase collections and perform CRUD operations effectively. I continued to learn how to work with Promises especially in an Angular project + template driven forms.
Articles:
-
"The 8 Best Coding Challenge Websites to Help You Level Up Your Skills in 2020" by Daniel Borowski on freeCodeCamp
-
"Angular Firebase Tutorial: Read/Write data into a NoSql Database Collection" by Chris House on Medium
Objectives:
- Continue with Complimentr(Add Filtering notes functionality)
- Building Progressive Web App(PWA) using angular
Progress:
I learned how to make an angular app PWA. Turns out it is pretty easy thanks to the angular team you barely even need to code. I made the Complimentr mini-app a PWA and it was fun and amazing implementing this feature. The filtering bit is gonna have to wait, its a bit technical.
Articles:
- "How to Use Deliberate Practice to Learn Programming More Efficiently" by Victor Cassone on freeCodeCamp
- "How To Build Progressive Web Apps with Angular" by Eniola Lucas Fakeye on DigitalOcean link: https://www.digitalocean.com/community/tutorials/how-to-build-progressive-web-apps-with-angular
- "Build a Progressive Web App with Angular" by John Green on medium
Objectives:
- Angular Services(Continue with project)
- Javascript30 - Day 1
Progress:
I learned how to work with Angular Title Service and implemented it in my project. It was amazing learning that this kind of service exists in angular. I implemented a carousel feature in one of my recent projects using Bootstrap. I began the Javascript 30days 30 projects challenge course by Wes Bos and created a Drum Kit for the first challenge(Topics: playing Audios, listening for transitions end event and Key events ) CodePen: https://codepen.io/ericko12/full/bGVZVyX
Articles:
- "10 things to learn on the way to becoming a JavaScript Master" by Lukas Gisder-Dube on medium link: https://levelup.gitconnected.com/10-things-to-learn-on-the-way-to-become-a-javascript-master-f4fc632b2bb7
- "Like
console.logBut Better" by Leira Sanchez
Objectives:
- Angular Services(Continue with project)
- Javascript30 - Day 2,3,4
Progress:
Completed Day 2,3 and 4 challenges in the Javascript30 course. Continued learning how to work with CSS variables and JS high order functions(map, reduce, sort, filter) I learned how to work wit email API and implemented it in one of the projects I am working on.
JS+CSS ClockCodepen: https://codepen.io/ericko12/full/XWmGyzm
Articles:
- "Set CSS styles with javascript " by Eugene Karataev on DEV.to
- "JavaScript Array Sort Tutorial - How to Use The JS Sort Method (With Code Examples)" by Cem Eygi on freeCodeCamp
- "How MySpace Taught Me How to Code and Where You Should Look to Develop Your Passion" by Colby Fayock on freeCodeCamp
Objectives:
- Ajax continuation - working with promises
- Flexbox refresher - Wes Bos Course
Progress:
I did a CSS Flexbox refresher exercise creating an amazing panel gallery with some slight guidance from the Wes Bos' JS30 course. I completed Day 5,6(Flex Panels Image Gallery and Ajax Type Ahead) challenges on the Javascipt30 challenge.
Articles:
- "Top 5 Tools and Skills For Frontend Developers" and "How I Got My First Remote Job As A Developer" by Bankole Ahmed on Hashnode
- "Defining Software Engineering Levels" by Usman Ismail on LinkedIn
Objectives:
- Flexbox refresher Continuation - Wes Bos Course
- Day 7,8- Javascript30 Challenge
Progress:
I continued with Flexbox practice. I also completed day 7 and 8 JS30 challenges reminding myself how to play with HTML5 canvas feature and some more high order Javascript functions.
Articles:
-
"HTML Entities – A List of HTML Space and other HTML Symbols and Special Character Codes" by Quincy Larson on freeCodeCamp
-
"A Free Course to Help Front End Developers Learn Math" by Per Harald Borgen on freeCodeCamp
-
"I created my own Pure CSS Micro-Framework, a tale " by Felippe Regazio
Objectives:
- Day 9,10,11- Javascript30 Challenge
- Complimentr project (PWA fix and adding search ahead firebase filter functionality)
- Project's backend logic authentication connection
Progress:
I completed day 9,10 and 11 Javascript30 challenges. I learnt and practiced how to work with JWT tokens in an Angular application. I implemented the same in one of the Angular projects I am currently working on. From the Javascript30 challenges I learnt how to customize a HTML5 video player and customized one.
Articles:
An amazing article and website I came across today(Day 66)
- "Angular Security - Authentication With JSON Web Tokens (JWT): The Complete Guide" link: https://blog.angular-university.io/angular-jwt-authentication
- "Four Design Patterns You Should Use in Web Development" by Milecia McGregor on freeCodeCamp
- "How to Create a Custom API From Any Website Using Puppeteer" by Taroque Ejaz on freeCodeCamp
- "How to Use On-Page SEO Techniques to Rank on the First Page of Google" by James Murphy on freeCodeCamp
- "How to Choose and Care for a Secure Open Source Project" by Victoria Drake on freeCodeCamp
Objectives:
- Vanilla JS Progressive Web Apps - Create a PWA News App
- Day 12,13- Javascript30 Challenge
- Bring Complimentr back to life
Progress:
I created a Vanilla JS progressive web app utilizing CSS variables to create a dark and light theme. I continued to learn how t use the async await js approach for fetching data from API endpoints. I fixed a PWA bug issue on the Complimentr App and added class toggle features using the @ViewChild decorator.
- Complimentr: https://complimentr.web.app
- To Let: https://tolet-ke.web.app
- DigiNews PWA: https://erickarugu32.github.io/diginews
Articles:
- "Emit an event from a child to parent component in Angular 9" by ZeroesAndOnes on medium
- "Full Angular 7|8|9 Firebase Authentication Tutorial Examples" link: https://www.positronx.io/full-angular-7-firebase-authentication-system/
- Continued with: "Angular Security - Authentication With JSON Web Tokens (JWT): The Complete Guide" link: https://blog.angular-university.io/angular-jwt-authentication/
Objectives:
- Day 12,13, 14,15, 16 - Javascript30 Challenge
- Complimentr Site
- GAD scholarship - Cloud Executive Briefing course
Progress:
I completed Day 12 through Day 16 challenges of the Javascript30 challenge. This plays a major role in helping me to continue solidifying my knowledge in JS basic concepts and tricks around DOM manipulation, local storage API, Objects, and Javascript events.
Besides the JS30 challenge, I continued working on the Complimentr App, improving the UI and firebase storage manipulation.
I completed the Cloud Briefing course by Simon Allardice on Pluralsight as part of the GAD scholarship qualification requirement - there was no coding though. From the course, I finally understood the general benefits of using Cloud Services (Cost, Convenience, Speed and Features), the distinction between the three major categories(IaaS, Paas and Saas) and the major characteristics of Cloud Computing (Internet Connected, Uses Third-Party Hardware, Self-Service, and On-Demand and Resource Pooling)
[There is a Cloud. It is not just someone else's computer.]
Articles:
I stumbled into these three random articles which I found intriguing:
-
"Front end Engineering. Beyond Front end Development 🚀" by Ejiro Asiuwhu on medium
-
"15 App Ideas to Build and Level Up your Coding Skills" by Florin Pop on medium
-
"How to Use the Mentoring Framework to Learn a New Skill" by Leonardo Faria
Objectives:
- Day 17 - Javascript30 Challenge
- Working with Git - How Git Works+GitHub
- Complimentr - phase 1 complete
Progress:
I delved deep into git to understand its core working concepts. By the end, I understood how GIT works under the hood by having an interlinked object model. "GIT is just a stupid content tracker" - final conclusion after the first day of learning. I also learned a few "plumbing" commands (low-level commands).
I completed the Complimentr project phase 1 - adding extra pages using the Bulma CSS framework. I also added filter/search functionality and refactored the code to ensure code reusability and speed. I learned how to filter data from firebase collections and databases.
- Complimentr: complimentr-ke.web.app``
- Repo: https://github.com/erickarugu32/complimentr ``
Articles:
- "Angular + Firebase + Typescript — Step by step tutorial" by Jonny Fox on medium
Objectives:
- Day 17 - 21 - Javascript30 challenge
- Complimentr => New User Registration functionality
Achievements:
I had fun creating a live video editing project using webcam in Javascript. Until then I didnt know it was easy to manipulate the Video and Audio API using pure Javascript. I also added a new user registration functionality to the Complimentr site. The whole project is really taking form and also helping me to continue advancing my Firebase, TypeScript and Angular knowledge.
Readings:
-
"How to Make Your Own VS Code Extension" by Pramono Winata on freeCodeCamp
-
"How I Created a Coronavirus Tracker App in Just 3 Days with Ionic and Firebase" by Kapil Raghuwanshi on freeCodeCamp
-
"Arrow Function JavaScript Tutorial – How to Declare a JS Function with the New ES6 Syntax" by Amy Haddad on freeCodecamp
Objectives:
- Day 22 - Javascript30 challenge
- Complimentr => Final Wrap up on version 2
- Diving deep into Git - Rebasing + Distributed Version Control
Achievements:
I completed deep git learning. I finally understood Git as a multilayered tool with each layer contributing to the success of this amazing distributed version control system. I learned the deeper difference between "rebase" and "merge".
Readings:
-
"Git — Version Control System" by Anjali Tiwari on medium link: https://towardsdatascience.com/git-version-control-system-666a1ffd85d3
-
"Git tutorial: Get started with Git version control" by William Rothwell on InfoWorld link: https://www.infoworld.com/article/3257791/git-tutorial-get-started-with-git-version-control.html
-
"git — Rebase vs Merge" by Filiz Senyuzluler on medium link: https://medium.com/datadriveninvestor/git-rebase-vs-merge-cc5199edd77c
-
"Advanced Git Tutorials" on Atlassian link: https://www.atlassian.com/git/tutorials/advanced-overview
Objectives:
- Day 23 - Javascript30 challenge
- Complimentr => Final Wrap up on version 2
Achievements:
I added the new user registration, google sign, and reset password functionality to the Complimentr app. I learned how to manipulate these firebase functionalities in an Angular project.
link: https://complimentr-ke.web.app
Readings:
-
"Firebase Authentication with Angular" by Dayana Jabif link: https://angular-templates.io/tutorials/about/firebase-authentication-with-angular
-
"Implementing Password Reset with Firebase and Angular" by Clearly Innovative on medium
-
"Pagination in Angular Firestore Firebase DB | Add/fetch Documents. | Integrate Angular Firestore in Project" by Ankit Maheshwari on medium
Objectives:
- Develop Shortly URL shortener website
- Day 22 - 25 Javascript30 challenge
Achievements:
I created a landing page for a typical URL shortener service - a challenge from the Frontendmentor site. I learned how to make POST requests using Fetch, copy stuff to the clipboard using pure js, and continued to expand my knowledge on how to create good looking responsive UIs in pure CSS by utilizing CSS flexbox.
I went through Wes's Javascrip30 Day22 through 25 challenges. I was excited to learn the following along with links highlighter, speechSynthesis Web Speech API, and more about DOM events => bubbling propagation, etc.
Readings:
-
"Copying to Clipboard Using Vanilla JavaScript" link: https://alligator.io/js/copying-to-clipboard/
-
"The Best Code Interview Prep Platforms in 2020" by Daniel Borowski on freeCodeCamp
-
"Hone your JavaScript skills by building these 15 projects" by Beau Carnes on freeCodeCamp
-
"How to Implement a Linked List in JavaScript" - freeCodeCamp
Objectives:
- A sample blog app -> Real-world application(Angular9, Node.js, and MariaDB)
- Books Web Design - Sample website using Bootstrap
Achievements: I created my first Angular Blog app utilizing the server-side rendering (SSR) with Angular Universal technology. Added a backend API using Node.js and express to provide the articles for the app. I learned the difference between Client-side and Server-side rendering, the major one being of course the speed. I went through the development of a modern responsive website using Bootstrap and Javascript.
Readings:
-
"JavaScript Promise Tutorial: Resolve, Reject, and Chaining in JS and ES6" by Cem Eygi on freeCodeCamp
-
"5 Git Commands You Should Know, with Code Examples " by Sarah Chima Atuonwo on freeCodeCamp
-
"The Cat Command in Linux – How to Create a Text File with Cat or Touch" by Hughie Coles on freeCodeCamp
-
"A Practical Guide to Load Testing" by Dipto Karmakar link: https://www.freecodecamp.org/news/practical-guide-to-load-testing/
-
"JavaScript Date Now – How to Get the Current Date in JavaScript" by Vijit Ail on freeCodeCamp
Objectives:
- Complete the Javascipt30 challenges
Achievements:
I finally created my first Javascipt game- Whack A Mole. With this I completed the JS30 challenge having learnt a couple of JS tricks I would have otherwise missed. Thanks to Wes for the amazing challenges.
Readings: "Front End Developer vs Back End Developer – Definition and Meaning In Practice" by Colby Fayock on freeCodeCamp
Objectives:
- JavaScript Objects, Classes, and Prototypes
Achievements:
The available different ways to create a class in Javascript - Constructor functions, Object Literals, Object.create, ES6 Classes
Javascript's Writable, Enumerable, Configurable, Set/Get properties
Prototypal inheritance, Inheritance/Prototype properties, Multiple Inheritance, Prototypal Inheritance Structures in JavaScript
Objectives:
- Design and develop a home page {client work}
- Submit FrontEndMentor challenges solutions
Achievements:
I designed and created a landing page using the new Bootstrap v5 and AOS CSS3 animation library. I completed and submitted solutions to two design challenges from https://frontendmentor.io
Links:
- A landing page: https://shortly-flame.vercel.app/
- A signup page: https://intro-sign-up.now.sh/
*Resources:
- I came across this thread on Twitter and wow, it's one of the best resourceful content I have come across of late. "Here's a list of JavaScript fundamentals and my favorite free resources for learning them." by @Madisonkanna on twitter
- FrontEnd Mentor resources list
Articles:
- "10 Rules of Studying Every Software Developer Should Follow" by Carol-Theodor Pelu on freeCodeCamp
Objectives:
- Stories App => Brad Traversy
- Create a REST API
- Node.js, Express refresher
Achievements:
Introduction to working with Passport, Node.js's authentication middleware (Oauth 2.0 Strategy) Created a Stories App using Node.js, Express, Passport, and Mongo DB thanks to Traversy Media on YouTube. Worked with JWT to create an authentication REST API using Node.js and Express
Resources:
Articles:
-
"6 Tools You Can Use to Check for Vulnerabilities in Node.js" by Dillion Megida on freeCodeCamp
-
"Evaluating page experience for a better web " by Google link: https://webmasters.googleblog.com/2020/05/evaluating-page-experience.html
Objectives:
- Deploying Node Apps to Heroku
- Blog Articles App => Node.js, Express and MongoDB
- Real-Time Chat App - Socket.io
- Advanced NPM
Achievements:
I effectively deployed my first Node.js app to Heroku - a Stories App whose main focus was to master the building blocks of Node.js by implementing the CRUD functionalities with MongoDB as the choice database.
Introduction to working with Socket.io I created a Real-time Chat app using Socket.io and Vanilla JS- no framework. I wanted to get the taste of working with Socket.io and how to integrate that in Node.js to create a functional app.
Dived deep into working with NPM. I learned how to effectively work with npm(beyond the basics) to create packages/apps that can be used by other people/public plus how to effectively publish an npm package to the npm registry to help others too.
Live: http://digi-stories.herokuapp.com/
Resources:
- Getting Started with NPM - am amazing course by Joe Eames on Pluralsight
- "Node.js App From Scratch | Express, MongoDB & Google OAuth" by Traversy: https://www.youtube.com/watch?v=SBvmnHTQIPY&t=5s
- "How To Build A Markdown Blog Using Node.js, Express, And MongoDB" by Web Dev Simplified: https://www.youtube.com/watch?v=1NrHkjlWVhM
- "Build A Restful Api With Node.js Express & MongoDB | Rest Api Tutorial" by Dev Ed: https://www.youtube.com/watch?v=vjf774RKrLc
Articles:
-
"How to deploy your Node.js / MongoDB app to the web, using Heroku" by Nicolai Safai on medium
-
"Deploying a Node.js App to Heroku" by Tom Kadwill on Stack ABuse link: https://stackabuse.com/deploying-a-node-js-app-to-heroku/
-
"Managing environment variables in Nodejs and Modern JS apps" by Mahmoud Felfel on Medium link: https://medium.com/dubizzletechblog/managing-environment-variables-in-nodejs-and-modern-js-apps-608003f4686c
Today's FunFact:
*npm* was officially acquired by GitHub in April this year. This move will see GitHub integrate the npm registry into their platform by the end of this year. In extension, it is also worth noting that GitHub itself was officially acquired by Microsoft back in 2018 for $7.5B in stock, a move that angered many developers around the world. The acquisition deal was confirmed by GitHub's CEO, Nat Friedman, in a blog post published on GitHub page in April, this year. Following this action, Microsoft has promised that nothing will change in terms of how developers work with the registry.
Objectives:
- JavaScript Design Patterns-
- Frontendmentor challenge - Four card feature
- Configuring Web Pack
- Continue with Node
Achievements:
I learned how to configure WebPack. I completed and submitted a fontendmentor challenge - Four card feature Introduction to the design patterns especially in JavaScript I continued practicing working with npm commands
- Link: https://four-card-feature-section-orpin-rho.vercel.app/
- Repo: https://github.com/erickarugu32/Frontendmentor-Challenges
Resource&Articles:
- " How to configure Webpack 4 from scratch for a basic website " by Antoe Melnyk on Dev.to link: https://dev.to/pixelgoo/how-to-configure-webpack-from-scratch-for-a-basic-website-46a5
Todays Goals:
- Design Pattern 1 - Creational Design Patterns(Continuation)
- Reminiscence(not code related but, why not)
- Setting up a Payment with Node.js and Stripe
Achievements:
Continued with working on WebPack Configuration set for a simple Website. I created a simple Payments Service with Checkout cart. Introduction to working with Stripe payment gateway plus how to integrate it with a Node application.
- WebPack Boilerplate: https://github.com/erickarugu32/webpack-boilerplate
Resources:
-
GSAP - Animation library
-
Webpack - open-source JS modules bundler Link: https://webpack.js.org/guides/development/
-
Daily Developer Tips Link: https://gomakethings.com/articles/
Articles:
- "A mostly complete guide to web pack (2020)" by Valentino Gagliardi link: https://www.valentinog.com/blog/webpack/
Reminiscence
Technically, today was supposed to be my last day(the 100th day-Round 1) in this #100DaysOfCode challenge. However, due to unavoidable situations, it's the 96th: I still have four-ish(4) days to go. Nevertheless, I am glad that I was able to utilize 26(86%) of the available 30 days this month(June). In the course of this challenge, I have seen remarkable personal growth in how I manage my time. Also, I have developed other daily routines that have made me a better programmer and person in general. It is as a result of participating in this challenge that I have also been able to program my mind to anticipate various daily tasks at specific times. Consequently, this has made my life fun, easy, organized, and productive. I cannot imagine how my last three months of self-isolation would have been without taking part in this challenge. I intend to continue with this routine even after the challenge and make this my day to day habit.
Thank you Gathosh for agreeing to do this with me
Goals:
- Set up a laravel project
- Deploy project on netlify + Domain customization(DNS, SSL, and TLS)
Achievements:
I learned how to configure a laravel environment and set a project with the aim of familiarizing myself with the framework to work with PHP back end devs on projects. I also deployed a project on netlify and added a custom domain - was interested in I the domain customization(DNS and TLS/SSL configuration)
- Configured project(I have note updated the code though): https://erickarugu.com
Articles:
-
"The bullish coalescing operator in vanilla JS (sorry, the what now?) " link: https://gomakethings.com/the-nullish-coalescing-operator-in-vanilla-js-sorry-the-what-now/
-
"Getting all of an elements siblings with vanilla JS " link: https://gomakethings.com/getting-all-of-an-elements-siblings-with-vanilla-js/
Goals:
- Basic JavaScript Calculator -ES6 Modules and Classes
Achievements:
I decided to end the journey similar to how I began - with a simple project. I created a simple JS calculator. I went through the new ES6 addons - Modules and Classes Reflecting on my achievements in the course of the past 100 days day.
- Full Log: https://rel.ink/nY847J
Fun Fact Well, I think this one is not funny at all but it's worth highlighting. GitHub's master branch naming convention was adopted from ancient slavery practices. Before the uprising of the now heated "Black Lives Matter" protests, it was impossible to change the name or add another default branch instead of the "master". The master branch was also created by default and was not disposable where other branches could be merged with the master and/or deleted. After heavy criticism, GitHub has however changed this convention and now the master branch can be deleted and the default responsibility delegated to another branch. Other alternatives names that have emerged for the default branch are "main" and "default".