Hello, my name is Yevhen. I am 23 years old and I'm going to become a fullstack developer in the future. I created this repository to study with Kottans frontend course. I started this course to improve my frontend knowledges.
I had some experience with:
- Python
- Git
- SQL
- HTML
- CSS
- JS
-
- Building a Tiny JS World (pre-OOP) - practice
-
- Object oriented JS - practice
-
- OOP exercise - practice
-
- Offline Web Applications - optional
-
- Memory pair game - real project
-
- Website Performance Optimization - optional
-
- Friends App - real project
- Listened week 1 and week 2 of Introduction to Git and GitHub
I had experience with Git before I took the lectures, but I became more familiar with how the merge command works and how to resolve merge conflicts.
- Completed levels of the game learngitbranching.js.org
The visual examples helped me to understand how branches and HEAD pointer work in Git.
- Completed Linux Survival:
I used to work with Linux bash before this course so actually I just refreshed my current knowledges.
- Read articles about HTTP protocol:
Thanks to these articles, I learned the differences between request methods POST and PUT and this became more clearly to me.
Also, I owerall improved my understanding of how HTTP protocol works and difference between HTTP and HTTPS.
-
Listened week 3 and week 4 of Introduction to Git and GitHub:
Overall, these lectures were interesting. I liked the speaker and I got a better understanding of the difference between
git merge
andgit rebase
. I will definitely use thegit rebase
command in the future.
Also, I almost always use short commandgit checkout -b branch_name
.In this lectures i gained a lot of information about how to collaborate with other developers.
Additionaly, I used to work with TravisCI before on my Python project to run tests earlier so I am familiar with CI/CD a bit. -
Completed levels of Linux Survival:
Tasks about remote branches were quite hard for me to solve. I guess I need more practise with real repositories, but still visual examples of branches helped me a lot too.
-
Listened lectures of week 1 and week 2 of HTML, CSS, and Javascript for Web Developers course
In general, I was already familiar with HTML before I listened to these lectures, so I refreshed my knowledge. It was fascinating for me to learn how websites worked before the advent of HTML.
Due to listening to this course, I learned more deeply how to count CSS selector specificity and how to combine them. It was unexpected for me to know that margin-bottom and margin-top of different elements are not adding to each other.
-
Comleted Learn HTML
-
Completed Learn CSS
Tasks here weren't tough for me, but
@font-face
is new for me for sure. Also, now I have better understanding of how CSS positioning works. Need more practise, I guess...
-
Read article Responsive web design basics
From this article, I learned what Responsive web design means and what its purpose is. In practice, I did not try to optimize the website for different screens.
-
Watched lectures about Flexbox
Flexbox is new tool for me. I heard about it before but never used.
-
Completed the game Flexbox Froggy
The game wasn't that hard, but it helped me to understand better the difference between
justify-content
andalign-items
and to understand how other properties related to flexbox work as well. -
Watched lectures about CSS Grid
I've never used CSS Grid before, so it's all new things to me and still a bit hard to understand because of lack of practise.
-
Completed the game Grid Garden
The game helped to realize better how CSS Grid works and what its use case.
To summarize, here I gained a lot of new information since I've never used Flexbox and CSS grid before (except using Bootstrap framework where CSS Grid is predefined so I didn't need to write these CSS rules on my own. I am definetly going to use both Flexbox and CSS Grid in my next task.
-
This task was so challenging for me to complete. The hardest part for me were CSS Flexbox, CSS Grid and aligning items at all since I never used CSS that much before. I spent a lot of time doing this task but also I learned a lot new stuff to me.
-
Listened lectures about JS
-
Completed tasks freeCodeCamp
To begin with, I was familiar with JS before a bit, but here I had a lot of practice with functional programming and algorithms. It was engaging to know that Array in JavaScript is actually not a separate data type as it is in many other programming languages, but just an object. Still, things like algorithms and recursions are not easy to me to understand but I'm sure it comes clearer after more practice.
-
Listened lectures about DOM
I've never worked with DOM before, so I need to practise a bit before completing last task of this section. Now I know that unlike CSS, JS is able to get elemnt in any place of the document.
-
Completed tasks 12 - 18 freeCodeCamp
I could'nt solve tasks like Fibonacci, Steamroller and Smallest common multiple without hints, while actually the others of this six tasks weren't that challenging and I solved them on my own. Still, the hardest concept to understand for me is recursions (and algorithms too, of course), more precisely they are understandable, but I can't implement them yet whithout hints.
-
JS-Dom practice
- Demo
- Code base
I liked this task, I had a lot of practice here and improved my understanding of DOM manipulation.
Updated to OOP version with classes (pre-OOP version in index_old.js)
-
Listened lectures about OOP Classes and Prototypes
It was unexpected to know that unlike in Python, classes in JavaScript are primarily syntactical sugar over JavaScript's prototype-based inheritance. As for me, classes syntax looks more clear than prototype syntax. The more I learn JavaScript, the more i see difference over Python. It is facinating to learn that both Python and JavaScript look similar but have so much differences in detail.
-
Completed Classic Frogger Game (finally meged (^.^) )
-
Joined Kottans clan on Codewars and reached 7kyu
This task felt confused at start. Thanks to bunch of console errors I understood how to deal with this task :)
- Demo
- Code base
Implementing SOLID principles was the hardest part for me, it's a valuable experience for me. Now I have better understanding of SOLID and what its purpose.
I got a lot of new information in this course. Now I understand how web pages are able to load content even if connection is lost or too slow. Everething in this course was new to me. I heard about caching before but didn't know hot to implement. Some cons of this course is that it is outdated. I wasted some time to make starting files work on my machine and even course repo troubleshooting chapter couldn't help me. For sure, I need to rewatch this course as I still don't quite understood the IndexedDB section. A little practice might help me too, I guess.