Become a WEB Developer from Scratch, step by step Guide

Focused View

Nicolae Matei

21:09:50

25 View

1. Introduction

1. About this course.mp4

01:50

2. Demo time.mp4

05:46

2. HTML Concepts we must know

1. The need of html TAGS.mp4

13:54

2. Lists.mp4

06:29

3. Tables.mp4

11:44

4.1 Prettier - Code formatter (marketplace).html

4. Prettier - Code formatter.mp4

08:24

5.1 Most Used Shortcuts.html

5. Code indent & troubleshooting.mp4

23:36

6. Images, Links and Forms.mp4

20:18

7. More about Forms and type of inputs.mp4

17:48

8.1 Presentation link.html

8.2 web-intro-presentation Code.html

8. Inspect elements from web sites.mp4

18:09

9.1 Colors Hexadecimal (w3schools).html

9. Attributes & Styling elements in HTML.mp4

18:19

3. CSS Concepts we must know

1.1 VSCode Browser Sync (marketplace).html

1. HTML Standard document and Browser Sync.mp4

11:28

2. CSS Selectors.mp4

13:34

3. Menu with Css Layout.mp4

17:49

4.1 CSS Units (w3schools).html

4. Inspect css from other sites.mp4

16:37

5.1 A Complete Guide to Flexbox (css-tricks.com).html

5. Flexbox Layout.mp4

24:17

6. Apply Flexbox Layout in our page.mp4

10:20

7. Grid Layout example.mp4

15:10

8. Grid Layout for Rubiks Cube Face.mp4

15:13

9. Final css for our site.mp4

22:02

4. JS Fundamentals

1. DHTML Demo.mp4

10:07

2.1 JavaScript Variables (w3schools).html

2. Variables.mp4

20:07

3. Objects Variables.mp4

25:28

4. Functions.mp4

13:07

5. JSON objects with Functions inside.mp4

14:55

6. JS EventListeners (interact with our menu).mp4

24:12

5. Git (Version Control System)

1. Save our code on github.com.mp4

19:58

2. Make changes and use git to track those changes.mp4

21:37

3.1 httpsgithub.comnmateinmatei.github.iotreeudemy.html

3. Make our site public (live).mp4

10:31

6. Create elements using js (DHTML)

1. Using global variables.mp4

12:33

2. Add event listeners on parent elements.mp4

20:59

3. querySelector with attributes.mp4

20:31

4. Using Array.map to create skills list.mp4

13:55

5. Use array with json objects inside.mp4

12:56

6. Making requests to load data (Fetch).mp4

20:42

7. Sorting skills based on number of endorsements.mp4

12:29

8. Recap.mp4

15:48

9.1 github.comnmateiweb-intro-presentation.html

9. Basic Es5 vs Es6.mp4

26:15

7. Basic JS Quiz & Homework

1. Basic string functions.mp4

17:48

2.1 github.comnmateisimple-quiz-app.html

2. Basic JS Quiz.mp4

21:19

3. JSON Intro Quiz.mp4

16:23

8. Starting new app and make it fully functional

1.1 github.comnmateiteams-networkingtreeudemy.html

1. Create new git repository.mp4

12:17

2.1 web-intro-presentationjs.html

2. Initialize project to use Prettier.mp4

11:41

3. Init project to use npm.mp4

10:58

4.1 package.zip

4.2 webpack.config.zip

4. Configure project to use webpack.mp4

21:10

5. Change the way we import js and css.mp4

12:54

6. Create HTML and CSS structure (layout).mp4

24:33

7. Create static table and make it look nice.mp4

09:48

8. Load teams with js from teams.json.mp4

11:22

9. Render items using string template.mp4

16:17

10. Create toolbar layout.mp4

09:43

11. Load data from node-API.mp4

14:45

12. Static form for create team.mp4

18:28

13. Update docs how to start the project.mp4

08:54

14. Create team request.mp4

24:51

15. Wait until request is done then reload the page.mp4

15:28

16. Delete team request.mp4

19:13

17. Update team request (array.find).mp4

34:40

18. Fixing missing parts of edit flow.mp4

19:41

19. Search teams (using array.filter).mp4

22:08

9. More Javascript concepts

1. Logical NOT (!) and ternary operator.mp4

16:58

2. Pure functions.mp4

13:56

3. Improve user experience for create team flow.mp4

15:10

4. Improve user experience for delete team flow.mp4

08:19

5. Object reference and mutations.mp4

17:50

6. Improve renderTeams function (array.every).mp4

28:04

7. Spread operator.mp4

15:56

8. Spread on json objects.mp4

19:52

9. Destructuring assignment.mp4

17:42

10. Rest parameter.mp4

09:13

11. Fetch and promises.mp4

16:32

12. Using promises with async & await.mp4

17:43

13. Import and use lodashdebounce.mp4

13:47

14. Code split in multiple js files (utilities, middleware).mp4

09:18

15.1 loading-mask.zip

15. CSS Loading Mask.mp4

11:13

16. Use loading mask in all places.mp4

08:15

17. Select multiple teams (static parts).mp4

07:32

18. Selectunselect all teams.mp4

06:23

19. Remove selected teams (final part).mp4

17:59

20. Update readme & cleanups.mp4

09:33

21. Homework.mp4

05:17

Description

If you wish to see what Web Development means and try it, what can you build with and how - you are in the right place.

What You'll Learn?

Web concepts every web developer must know
Learn how to create your own webpages and web applications
Learn how to reproduce any parts of a web page
You can decide if you wish to become a Developer or you wish other Programming languages

Who is this for?

Take this course if you're willing to become a web developer, but not only web, as we will learn basic programming skills

If you are not decided if you wish to go to any live courses, or even University this course could help you.

If you are already an Java/C# and wish to learn Web, this course will help you grow.

What You Need to Know?

No programming experience needed. You will learn everything you know step by step.

More details

Description
We will learn the basic html & css concepts we need to know, we will discover the most important parts of web development, and will understand how they work, why they behave in that way. And after that we will be able to reproduce any parts of a web page.
I'll explain some css layouts (css layout, flexbox, grid layout), concepts so you could organize and create any layout or skeleton pages. Also if you wish to know better what are css selectors - I'll touch this topic as well.
You will be building 2 projects, where you will apply the knowledge we learn in the course.
We will build step by step both projects and you should be able to type the code I'm typing and see the results.
Pure JavaScript is vital so we have to take more time to understand how JS works, what are key concepts in this programming language. I'll explain all JSÂ concepts you have to know to be able to start any web project and also understand others code in the future. Working with data and understand and create flows in our apoplications will be a big part of this course.
I'll teach you how to use VSCode as IDE Editor and how to save your code on GitHub. We will use basic git commands every programmer should know.
If you are a Backend developer that want to learn more about how to create your own web interfaces, this course could help you!
Few JavaScript keywords that I'll touch:
Array helpers, JSON, DOM, Events, callback, Promises, pure functions
Who this course is for:
Take this course if you're willing to become a web developer, but not only web, as we will learn basic programming skills
If you are not decided if you wish to go to any live courses, or even University this course could help you.
If you are already an Java/C# and wish to learn Web, this course will help you grow.

User Reviews

Rating

average 0

Total votes0

Focused display

Nicolae Matei has been building complex Web Applications in big companies. He started his career in 2006 at a Software company and at the same time was teaching students as a Lector at Technical University of Moldova. When he moved to Romania, he tried to also combine working at his new company with his hobby by teaching others and helping them restart their career in development.Nicolae is also certified in Oracle Certified Professional, Java SE 6 Programmer and is one of founders of RWS/Testy framework that helps QA's automate their code faster and nicer.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.