msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '2150f471a9'
${ noResults }
Web-Dev-For-Beginners/3-terrarium
History
SmashedFrenzy16 cb6a69d3f1
Update README.md 		2 years ago
..
1-intro-to-html add and update tracking links 2 years ago
2-intro-to-css update tracking links with / and remove MLSA link 2 years ago
3-intro-to-DOM-and-closures Update README.md 2 years ago
images folder names 4 years ago
solution add and update tracking links 2 years ago
translations Merge pull request #890 from phalopes/fix/adjusts_pt_README_translation 2 years ago
README.md Merge pull request #856 from tarunl2002/main 2 years ago

README.md

My Terrarium: A project to learn about HTML, CSS, and DOM manipulation using JavaScript 🌵🌱

A small drag and drop code-meditation. With a little HTML, JS and CSS, you will be able to build a web interface, style it, and even add multiple interactions of your choice.

my terrarium

Lessons

  1. Introduction to HTML
  2. Introduction to CSS
  3. Introduction to DOM and JS Closures

Credits

Written with ♥️ by Jen Looper

The terrarium created via CSS was inspired by Jakub Mandra's glass jar codepen.

The artwork is hand drawn by Jen Looper with the help of Procreate.

Deploy your Terrarium

You can deploy, or publish your terrarium on the web using Azure Static Web Apps.

  1. Fork this repo

  2. Press this button

Deploy to Azure button

  1. Walk through the wizard creating your app. Make sure you set the app root to either be /solution or the root of your codebase. There's no API in this app, so don't worry about adding that. A github folder will be created in your forked repository that will help Azure Static Web Apps' build services, build and publish your app to a new URL.