GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → 4GeeksAcademy → html-tutorial-exercises-course

4GeeksAcademy / html-tutorial-exercises-course

Licence: other
Learn HTML with an interactive and auto-graded tutorial with dozens of exercises.

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects
Dockerfile
14818 projects

Labels

learningtutorialtutorialslearn-to-codelearning-exerciselearnlearning-by-doinghtml-tutorialtutorialesinteractive-tutoriallearn-htmlhtml-courselearning-htmlhtml-exercisesinteractive-htmlautograded-exercisesautograded-html

Projects that are alternatives of or similar to html-tutorial-exercises-course

50 Projects For React And The Static Web
⚛ 50 project ideas to learn by doing complete with project briefs, layout ideas, and resources!
Stars: ✭ 319 (+1286.96%)
Mutual labels:  tutorials, learn-to-code, learning-by-doing
awesome-by-example
😎 A curated list of example-based learning resources.
Stars: ✭ 97 (+321.74%)
Mutual labels:  learn-to-code, learning-exercise, learning-by-doing
Javascript Exercises
📚 Collection of JavaScript exercises and coding challenges.
Stars: ✭ 385 (+1573.91%)
Mutual labels:  learn-to-code, learn, learning-by-doing
tutorials
All of the code for my Medium articles
Stars: ✭ 130 (+465.22%)
Mutual labels:  tutorials, learning-by-doing
Projectlearn Project Based Learning
A curated list of project tutorials for project-based learning.
Stars: ✭ 699 (+2939.13%)
Mutual labels:  tutorials, learning-by-doing
Tutorials
All of the code for my Medium articles
Stars: ✭ 92 (+300%)
Mutual labels:  tutorials, learning-by-doing
godot recipes
Lessons, tutorials, and guides for game development using the Godot game engine.
Stars: ✭ 135 (+486.96%)
Mutual labels:  tutorials, learn
tutorials
Ably Tutorials in multiple languages
Stars: ✭ 35 (+52.17%)
Mutual labels:  tutorials, learning-by-doing
cloudwithchris.com
Cloud With Chris is my personal blogging, podcasting and vlogging platform where I talk about all things cloud. I also invite guests to talk about their experiences with the cloud and hear about lessons learned along their journey.
Stars: ✭ 23 (+0%)
Mutual labels:  learning-exercise, learning-by-doing
TeachMePythonLikeIm5
Teach the Python programming language using a collection of super beginner friendly tutorials and challenges.
Stars: ✭ 23 (+0%)
Mutual labels:  tutorials, learning-by-doing
Udacity-programming-for-Data-Science-With-Python-Nanodegree
This reprositry contain all the codes of Udacity programming for data science course
Stars: ✭ 22 (-4.35%)
Mutual labels:  learn-to-code, learning-by-doing
Python Tutorial
A Python 3 programming tutorial for beginners.
Stars: ✭ 647 (+2713.04%)
Mutual labels:  tutorials, learn-to-code
Start Machine Learning In 2020
A complete guide to start and improve in machine learning (ML), artificial intelligence (AI) in 2021 without ANY background in the field and stay up-to-date with the latest news and state-of-the-art techniques!
Stars: ✭ 357 (+1452.17%)
Mutual labels:  tutorials, learn-to-code
Nodejs Roadmap
【🔥持续更新中】Node.js 实战学习路线
Stars: ✭ 188 (+717.39%)
Mutual labels:  tutorials, learning-by-doing
lcbo-api
A crawler and API server for Liquor Control Board of Ontario retail data
Stars: ✭ 152 (+560.87%)
Mutual labels:  learn-to-code, learning-by-doing
FortranTip
Short instructional Fortran codes associated with Twitter @FortranTip
Stars: ✭ 39 (+69.57%)
Mutual labels:  tutorials, learn
start-machine-learning
A complete guide to start and improve in machine learning (ML), artificial intelligence (AI) in 2022 without ANY background in the field and stay up-to-date with the latest news and state-of-the-art techniques!
Stars: ✭ 3,066 (+13230.43%)
Mutual labels:  tutorials, learn-to-code
Ziglearn
Repo for https://ziglearn.org content. Get up to speed with Zig quickly.
Stars: ✭ 135 (+486.96%)
Mutual labels:  learn-to-code, learning-by-doing
Carmel
The Open Digital Innovation Marketplace
Stars: ✭ 136 (+491.3%)
Mutual labels:  learn-to-code, learning-by-doing
csharp
📚 Recursos para aprender C#
Stars: ✭ 37 (+60.87%)
Mutual labels:  learn-to-code, learn
View All Similar Projects ➔

HTML5 Exercises Tutorial at 4Geeks Academy

By @alesanchezr and other contributors at 4Geeks Academy

last commit last commit last commit

Complete selection of autograded html exercises, anyone interested in learning HTML!

Hi! I'm Alejandro Sanchez @alesanchezr, really excited to have you here! 🎉 😂 Learning to code is hard, you need coaching! DM me on twitter if you have any question. You'll be learning the following concepts:

  1. Get familiar with most of the most popular HTML Tags.

  2. Using the tags together to create a simple HTML Website.

  3. Linking websites together using Anchors with Relative or Absolute paths.

  4. The HTML audio and video tag.

Before we start... other related tutorials

  1. Learn HTML← your are here now
  2. Learn CSS
  3. Learn Bootstrap

🌱 How to start

There are two ways to run the exercises: Immediately in gitpod (recommended) or locally in your computer (requires installation).

A) Open immediately with Gitpod (one-click)

This exercises are configured to easily open in gitpod.

Open in Gitpod

B) Manual installation

  1. Install learnpack, the package manager for learning tutorials and the html compiler plugin for learnpack, make sure you also have node.js 14+:
$ npm i learnpack -g
$ learnpack plugins:install learnpack-html
  1. Download this particular exercises using learnpack and cd into the folder:
$ learnpack download html-tutorial-exercises-course
$ cd html-tutorial-exercises-course

Note: Once you finish downloading, you will find a "exercises" folder that contains all the exercises within.

  1. Start the tutorial/exercises by running the following command at the same level were your bc.json file is:
$ npm i [email protected] -g
$ learnpack start

Note: The exercises have automatic grading but its very rigid and string, my recomendation is to ignore the tests and use them only as a recomendation or you can get frustrated.

How are the exercises organized?

Each exercise is a small react application containing the following files:

  1. index.js: represents the entry file for the entire app.
  2. README.md: contains exercise instructions.
  3. test.js: you don't have to open this file, it contains the testing script for the exercise.

Contributors

Thanks goes to these wonderful people (emoji key):

  1. Alejandro Sanchez (alesanchezr), contribution: (coder) 💻 (idea) 🤔, (build-tests) ⚠️, (pull-request-review) 👀 (build-tutorial) ✅ (documentation) 📖

  2. David Hay (haydavid23), contribution: (test) ⚠️

  3. Daniel Machota (@d4rkm0nst3r), contribution: (build-tutorial) ✅, Translation 🌍

This project follows the all-contributors specification. Contributions of any kind are welcome!

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].