EatTheBlocks – Web Development For Blockchain 2022
If you want to become a Blockchain developer, you first need to have some basic web development skills.
However, web development is a HUGE topic… backend, frontend, devops, aws, etc…
Do you need to learn ALL of this for Blockchain?
Fortunately no!
You only need to learn FRONTEND web development: html, css and Javascript.
However, most bootcamp and courses about web development will teach way more than that…and would make you waste a lot of time…
Fear not!
I have created this program ESPECIALLY for people like you.
In this 3h training I will teach you the basics of web development:
- How web applications work
- How to structure web pages with html
- How to style web apps with css
- How to make your app interactive with Javascript and React
After you follow this, you will be ready to learn Blockchain development.
PS: this is the project we will build on the section of React. A fully-functional todo app:
Your Instructor
Julien Klepatch
Hi! My name is Julien and I am the instructor of EatTheBlocks Pro.
I am a senior Blockchain software engineer. I used to work in Finance, and I switched to software development 6 years ago.
For the past 3 years, I have been building Dapps and Solidity smart contracts for several Ethereum and ICOs projects, including Lendingblock, an institutional crypto lending exchange.
I run EatTheBlocks, a youtube channel for Ethereum developers. I have also published a Blockchain course for Manning.
I also contribute to the code of Drizzle and I spoke at TruffleCon 2019 on Drizzle.
I also have extensive experience with Nodejs, Javascript & React, having worked as a full-stack software engineer for the last 6 years. Github & LinkedIn
Course Curriculum
Welcome
- Welcome (0:48)
Basics of web development, HTML & CSS
- 1. Architecture of web application: frontend & backend (1:17)
- 2. Website vs web application (2:21)
- 3. Frontend & backend communication with the HTTP protocol (4:43)
- 4. What is HTML? (1:56)
- 5. Basic structure of an HTML file (2:41)
- 6. Insert text and images with div, p and img tags (4:47)
- 7. Create links with the a tag (0:43)
- 8. Display list of data with tables (1:41)
- 9. Collect data with forms (2:06)
- 10. Add styling to an HTML component with CSS (4:23)
- 11. More CSS rules: margin, padding, layout (3:10)
- 12. Make your web app look good EASILY with Bootstrap (12:30)
- 13. Advanced CSS: CSS Flexbox and CSS Grid (3:16)
Introduction to Javascript
- 1. Introduction (1:02)
- 2. What Javascript is used for? (3:04)
- 3. Strings (3:33)
- 4. Numbers (1:46)
- 5. Booleans (0:25)
- 6. Arrays (4:06)
- 7. Objects (4:54)
- 8. Control structures: if, for-loop, while, switch (6:22)
- 9. Functions (4:18)
- 10. Promises (4:44)
- 11. The DOM (Document Object Model) (3:35)
- 12. ES6 features (18:12)
- 13. Frontend vs Backend Javascript (NodeJS) (2:10)
- 14. Homeworks (4:41)
Your first React App: a todo list
- 1. Introduction (1:02)
- 2. Why we need React? (2:13)
- 3. How React work? (2:09)
- 4. JSX (0:47)
- 5. Webpack & Babel (1:42)
- 6. Create a React project super quick with create-react-app (4:08)
- 7. Install Bootstrap for quick & and easy styling (0:53)
- 8. Create your first React component (2:25)
- 9. Render a list in React (2:40)
- 10. Pass data to child components with props (2:28)
- 11. Use Bootstrap grid and Jumbotron components (1:16)
- 12. Create another component for new tasks (2:12)
- 13. Manage component state with the useState() hook (4:01)
- 14. Lift the state up to parent component (5:13)
- 15. Mark task as done (7:35)
- 16. Delete task (2:39)
- Next steps