My first task in the Technigo Front-end Developer Bootcamp. Main focus was to learn Flexbox properly but also to include CSS Grid-function and overall layout of the page.
After selecting the subject and name I started looking at other editoral sites for inspiration. Then I chose the layout and other design elements such as fonts, colors and structure before writing my first lines of code.
I did not run into any specific problems until I started working on the details such as image fit and margins/paddings.
The major breakthrough I got was when I asked about the margins in StackOverflow and one answer reminded me about default margins. So after resetting margins, paddings and borders on all used elements I could set new ones. Same regarding the image fit, which was solved by adding max-width and vertical-align.
I found out during the process that working in Developer Tools and adding code through the inspector made my editing and problem searching much more efficient. I was also very pleased to see that my eagerness to succeed with certain things paid of, if I did enough research and gave it a few more tries.
If I had more time I would look into browser-compatability and -moz/-wekit-prefixes.
For my next project I will plan the website in Figma to begin with, instead of/as well as a notepad, for an overall view of the project. I would also name my classes a bit differently to make it easier to differentiate sections from each other. Finally I would work more thoroughly with commits and structuring my repository.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent