Microsoft offers web development for beginners

Microsoft has released a new, free, self-paced program for those new to programming and web development.

Web-Dev-For-Beginners, which is hosted on GitHub with links to You Tube videos, is a collaboration between many developers in the Microsoft stack; Project managers, Cloud, AI and JavaScript advocates, each working on different parts of the curriculum which includes a total of 24 lessons.

It teaches HTML, CSS, and JavaScript, the latter without the use of frameworks. This is done to avoid introducing another complexity into the project, that of having to learn the intricacies of a separate setting, while keeping the emphasis on learning the language itself. It’s a good approach that follows the latest trends that encourages people to break out of frameworks and go for plain vanilla JavaScript.

It really starts from scratch with a very brief 01- “Introduction to Programming Languages ​​and Tools of the Trade” where he explores the concept of programming and what programming languages ​​are. He then moves on to code management with a 02- “Introduction to GitHub”, and continues with 03- “Creating accessible web pages”.

All that instructors see as a benefit in starting to write code is what happens from Unit 4, JS Basics-JavaScript Data Types. From there until the end in unit 24 is all the code that involves building apps and games:

  • 05-JS Basics-Functions and methods. Learn more about the functions and methods of managing the logic flow of an application Functions and methods
  • 06-JS Basics-Make decisions with JS. Learn how to create conditions in your code using decision-making methods
  • 07-JS Basics-Arrays and Loops. Work with data using arrays and loops in JavaScript arrays and loops
  • 08 HTML terrarium in practice. Build HTML to create an online terrarium, focusing on creating a layout Introduction to HTML
  • 09-Terrarium-CSS in practice. Build CSS to style the terrarium online, focusing on CSS basics including making the CSS Introduction page responsive
  • 10-Terrarium-JavaScript closures, DOM manipulation. Building the JavaScript for the terrarium to work as a drag and drop interface, focusing on closures and DOM manipulation JavaScript closures, DOM manipulation
  • 11-Typing game-Build a typing game. Learn how to use keyboard events to drive logic in your JavaScript application.
  • 12-Green Browser Extension-Work with browsers. Learn how browsers work, their history, and how to build the first elements of a browser extension About browsers
  • 13-Green Browser Extension – Create a form, call an API and store variables in local storage. Create the JavaScript elements for your browser extension to call an API using variables stored in local storage APIs, forms, and local storage
  • 14-Green Browser Extension-Background process in browser, web performance. Use the browser background processes to manage the extension icon; learn more about web performance and some optimizations for performing background tasks and performance
  • 15-Space Game-More advanced game development with JavaScript. Learn about inheritance using both classes and composition and the Pub / Sub model, in order to create a game Introduction to advanced game development
  • Set of 16 drawing spaces on canvas. Learn more about the Canvas API, used to draw elements on a Drawing to Canvas screen.
  • 17-Space Game-Moving elements around the screen. See how elements can move using Cartesian coordinates and the Canvas Moving Elements Around API
  • 18-Space Game-Collision detection. Make the colliding items and react with each other using keys and provide cooling function to ensure the performance of the game. Collision detection
  • Game keeping score of 19 spaces. Perform math calculations based on game condition and performance.
  • End the game on 20 spaces and restart the game. Learn about ending and restarting the game, including cleaning up assets and resetting variable values. The end condition
  • 21-HTML banking application templates and routes in a web application. Learn how to create the architectural scaffolding of a multipage website using routing and HTML templates HTML templates and routes
  • 22-Banking App-Create a login and registration form. Learn more about creating forms and managing validation routines.
  • 23-App-Banking – Methods of retrieving and using data. How data enters and leaves your application, how to retrieve, store and dispose of it
  • 24-Banking App-Concepts of state management. Find out how your app maintains state and how to manage it programmatically

Regarding the course deliverables,

by the end of the day, students will have built a typing game, a virtual terrarium, a “green” browser extension, a “space invaders” type game and a business-type banking application, and will have learned the basics of JavaScript, HTML , and CSS with today’s modern web developer’s toolchain.

It’s pretty much a full course that includes nice sketches, additional video tests, step-by-step guides on how to build the projects, knowledge checks, challenges, and homework that should be enough to start your journey. .

After going through it, you will look for the next steps. Instructors advise you to continue with “Beginner Series to: JavaScript”, a number of videos of which are included in this program, and then continue with “Beginner Series to: Node.js”. We cover them both in Learn JavaScript and Node.js with Microsoft.

webdevsq

More information
Web-Dev-For-Beginners

Related Articles

Learn JavaScript and Node.js with Microsoft

To be informed of new articles on I Programmer, subscribe to our weekly newsletter, subscribe to the RSS feed and follow us on Twitter, Facebook or Linkedin.

Banner

square

comments

or send your comment to: comments@i-programmer.info

James S. Joseph