The log of my #100DaysOfCode challenge. Started on August 28, Friday, 2020.
Today I worked on some basic HTML, CSS and Applied Visual Design to get in the flow. Therefore I used the lessons at freeCodeCamp.org
Learned a lot about:
- Accessibility
- Responsive Web Design Principles
- CSS Flexbox
- CSS Grid
I used the lessons at freeCodeCamp.org
Working my way through the Responsive Web Design Path by freeCodeCamp.org
Made a very basic website as part of the Projects: https://codepen.io/mhstrkmp/pen/JjXJpNW
Learned more about Flexbox with: Flexbox Zombies
Working my way through the Responsive Web Design Path by freeCodeCamp.org
Made a very basic website with survey as part of the Projects: https://codepen.io/mhstrkmp/pen/yLOXreK
Again learned some more about Flexbox with: Flexbox Zombies
Digging further through the Responsive Web Design Path by freeCodeCamp.org
Started with the Product Page as part of the Path.
Again learned some more about Flexbox with: Flexbox Zombies
Overall a great day 🚀
-
Responsive Web Design Path by freeCodeCamp.org
-
Made a Product website as part of the Projects: https://codepen.io/mhstrkmp/pen/jOqLRdx
-
Responsive Web Design Path by freeCodeCamp.org
-
Worked on the Technical Documentation Page as part of the Path.
Sometimes you have to go the extra mile and make your day longer than 24 hours if you want to reach your goals ...
-
Responsive Web Design Path by freeCodeCamp.org
-
Worked on the Technical Documentation Page as part of the Path.
- Especially the usage of code blocks.
- You have to encode HTML Entities like <> by hand or use a syntax highliter like prism.js
Responsive Web Design Path by freeCodeCamp.org
- Worked on the Technical Documentation Page as part of the Path.
- Again learned some more about Flexbox with: Flexbox Zombies
Responsive Web Design Path by freeCodeCamp.org
- Today refreshed some HTML, CSS and Git.
Responsive Web Design Path by freeCodeCamp.org
- Today i made kind of a Technical Documentation Page as part of the path. https://codepen.io/mhstrkmp/pen/VwarPby
Responsive Web Design Path by freeCodeCamp.org
- Today I started to build the Portfolio Page as part of the path.
Code comes more and more out of my brain. I have to spend less time looking up how things are done.
Responsive Web Design Path by freeCodeCamp.org
- Today I worked on the Portfolio Page as part of the path.
- Not done yet but here a link to my work so far: https://codepen.io/mhstrkmp/pen/GRZQrJW
Responsive Web Design Path by freeCodeCamp.org
- Today I finished the basic Portfolio Page as part of the path.
- Link to work: https://codepen.io/mhstrkmp/pen/GRZQrJW
- 🎉 Finished Responsive Webdesign Path by @freeCodeCamp and got my Certification.
Next up: JavaScript
Today I learned some JavaScript at freeCodeCamp.org Think I'll finish the Basic JavaScript section tomorrow.
Looking forward to learning about ES6.
Today I learned some JavaScript at freeCodeCamp.org The basic JavaScript section is nearly done.
🎉 Finished the basic JavaScript section at freeCodeCamp.org
- Some of the concepts were hard to grasp.
- I'm pretty sure that I have to do a recap of all the things I've learned so far 😉
Anyways a great day!
Today i finished the ES6 section at freeCodeCamp.org
Awesome to learn a more modern version of JavaScript. So far I really enjoyed it 🤗
Today I finished the Regular Expression section at freeCodeCamp.org It is a really well-crafted section with lots of good examples 👍
✅ Finished the Debugging section at freeCodeCamp.org
✅ Build my first React App following this awesome little tutorial by @ASpittel
- Basic Data Structure by freeCodeCamp.org
- Learned how To Create a Pull Request on GitHub based on this well-written Tutorial
- Made a Pull Request
✅ Some more Basic Data Structure by freeCodeCamp.org
✅ Review of what I've learned so far.
Relaxed weekend session ...
🎯 Finished the Basic Data Structure Section by freeCodeCamp.org
✅ Some reading and review
✅ Some Basic Algorithm Scripting by freeCodeCamp.org
🤗 Playtime with Next.js and Tailwind CSS
✅ More Basic Algorithm Scripting by freeCodeCamp.org
✅ Digging deeper into Next.js and Tailwind CSS
Today I learned more about Next.js 🤗
- Today I went through some Documentation and Tutorials by Github.
- Did the Introduction to GitHub Course by the GitHub Learning Lab.
- Basic Algorithm Scripting by freeCodeCamp.org
🎯 Finished the Basic Algorithm Scripting Section by freeCodeCamp.org
- Progress with this section felt quite slow. But the concepts need time to soak in therefore I'm happy with it 😉
🎯 Finished the Object Oriented Programming Challenges by freeCodeCamp.org
✅ Today I was working on the Functional Programming Challenges by freeCodeCamp.org
✅ Learned more about Git and GitHub at GitHub's Learning Lab.
The second day of my Web Development Bootcamp.
I learned a lot of stuff about the Shell, Git, GitHub, Markdown ...
Day 3 of my Web Development Bootcamp.
A huge amount of Git, GitHub, VSCode sprinkled with a little bit of Markdown and HTML ... 😎
Ever screwed up your commits?
👉 https://ohshitgit.com/
Day 4 of my Web Development Bootcamp.
- Learned some more Git, HTML, and Bootstrap
- First "official" pull request to a beautiful open source project.
Day 5 of my Web Development Bootcamp.
- Today – Deep Dive into Bootstrap 🙌
- Working on a personal website as part of my Web Development bootcamp 🤩
✅ Working on a personal website as part of my Web Development Bootcamp.
- It feels awesome when years of just tinkering around come together to create something new 🎉
Bootcamp Day 6
- Learned to use Storybook.js.
- The website is nearly ready.
- I'm quite happy as it is the first time I build something like this from scratch.
- https://mhstrkmp.github.io/bootstrap-portfolio-fun/
Bootcamp Day 7
- Learned about CSS selectors
- More CSS and Storybook.js
Bootcamp Day 8
- HTML, CSS and Storybook.js in general
- Flexbox
Bootcamp Day 9
- CSS custom properties
- CSS Grid
- BEM
Bootcamp Day 10
- Such an inspiring Day!
- Pair programming the whole Day. It's so enlightening to follow someone's thoughts about how to code piece by piece 🙌
- Working on some open-source contributions.
- Pull Request was accepted and merged 🎉
- Today was mostly relaxed
- Some code review and studying
Bootcamp Day 11
- Introduction to JavaScript and how to use it for making components in Storybook.js
Bootcamp Day 12
- UX and UI Design Workshop
- JavaScript
Bootcamp Day 13
- JavaScript
- especially how to keep your code clean and structured.
Bootcamp Day 14
- JavaScript
- Object Destructuring
- Rest Parameters
- Spread syntax ...
Bootcamp Day 15
- So proud! I'm halfway through the challenge.
- My Brain and JavaScript starting a friendship ...
- Building reusable Components in Storybook.js with JavaScript.
- Relaxed weekend coding session
- Working a bit on our project from Friday
- Learning about Git and GitHub
- Stumbled upon those cool Github Templates 😎
- One day off 🏝
- Webpack
- JavaScript
Strange day 🤔
When our coach described something it felt logical and I could follow along without any problems.
When I had to do it on my own ...
- JavaScript
- Api
- JavaScript
- Infinite loading while scrolling down
- local storage
- Working with the Rick & Morty API
- JavaScript
- Working with API's
Personal insight of today:
If you want your function to run don't place it after the outer functions return statement ... 🤦♂️
- JavaScript
- CodeReview
- JavaScript
- Code Review
- Working with the Tronald Dump API
- JavaScript
- Code Review
- Introduction to React
- JavaScript
- Code Review
- React with API‘s
- JavaScript
- Code Review
- React with API‘s
- Test-Driven Development
Great day but my brain is exploding ...
- JavaScript
- React
- Testing with Jest
- Continuous Integration
- React
- Continuous Integration
- Test-driven development
- Code review
- React
- Test-driven development
- Todo App in React
- following DevEd tutorial https://youtu.be/pCA4qpQDZD8
- it really helps to get a better understanding of React.js
- React
- Storybook
- Styled-Components
- React
- Storybook
- React Router
- React
- React Router
- URL params in React
- Build a fake REST API with JSON Server
- React
- Build a fake REST API with JSON Server
- API Methods
- React
- JavaScript
- regex
- React
- JavaScript
- Chrome Extension
- React
- JavaScript
- Learning about developing a browser extension
- Building a Fake API with json-server
- Code review
- Learned to fork and contribute to other projects
- Learned to solve merge conflicts
- Node
- Build JavaScript CLI App
- Node
- JavaScript
- Building a CLI Password Manager
- Node
- JavaScript
- MongoDB and MongoDB Atlas
- Building a CLI Password Manager
- Lean Coffee
- Node
- JavaScript
- MongoDB and MongoDB Atlas
- CRUD
- Building a CLI Password Manager
- Agile Workshop
- Node
- JavaScript
- MongoDB and MongoDB Atlas
- CRUD
- Building a CLI Password Manager
Today less coding more research and planning about upcoming projects.
- Node
- Express
- Design Workshop about building Prototypes in Adobe XD
- Learned how to get "create-react-app" to work with my API
- Node
- MongoDB
- React
- Implementing a proxy server
- React Hooks
- Building a deployment pipeline with GitHub and Heroku
- Deployment of a boilerplate create react app including Storybook 🔥🔥🔥
Building a repository template to showcase portfolio projects.
It will include:
- Express.js for serving
- Create-React-App to show the App itself
- Storybook for developing and feature components
- ESLint, Prettier ...
Working on my repository template for portfolio projects.
Learning about git tag and GitHub Actions
Today is the day. After those intense and awesome last weeks in Bootcamp, it's project time.
Now I've to build my very own app as completion. I'm gonna build an app to get rid of some clunky processes in craftsmanship ...
- TDD Workshop with Jest and Cypress
- Prototyping with AdobeXD
- TypeScript Workshop
- Prototyping with AdobeXD
- Design and Prototyping with AdobeXD
- Set up a project in GitHub
- Design and Prototyping with AdobeXD
- Configure project in GitHub
- Review several Projects
Looking forward to next week when it's gonna be more coding ...
- One day off. I'll append it to the end ...
- Today mostly finishing the Design and Prototype of my Project.
- Finished the Design and Prototype after review.
- Finally Coding!!!
- Mostly working with React Router
- Getting my feets wet with TypeScript
- Snapshot Testing
- Building styled components
- Working in storybook
- Building styled components
- Working in storybook
- Building styled components
- Working in storybook
Not over yet 😉
I missed two days which I'll append as promised ... Today I was working with React and Styled Components.
- Great day!
- Getting in the flow with React
It's done! I've successfully finished #100DaysOfCode 🎉
Things I've learned throughout this Challenge:
- It helps to not do this alone. Connect with like-minded people to learn something new. This will supercharge your process and is way more fun.
- You can learn a lot of new things if you making a consistent process. There will be days when you're not able to do much and other days when you rock it. It doesn't matter how much you've learned in one day as long as you learn something every day.
- Start building things on your own as soon as possible. All those tutorials are great but use them mostly to start or if you want to get an overview of something. Building things is what moves you further.
- Trust yourself. Don't give up too early when you're stuck. Take a break or go on with another thing. Revisit the problem a few days later and you'll often understand it quite magically ...
- This challenge helped me to learn and was the perfect preparation for my boot camp. I highly recommend you to take part if you want to learn to code quickly and make it a habit.