mirror of
https://github.com/microsoft/frontend-bootcamp.git
synced 2026-01-26 14:56:42 +08:00
Add title to index page
This commit is contained in:
323
index.html
323
index.html
@@ -1,169 +1,188 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.6.1/css/fabric.min.css" />
|
||||
<link rel="stylesheet" href="./assets/shared.css" />
|
||||
</head>
|
||||
<body class="ms-Fabric">
|
||||
<div class="Container">
|
||||
<h1>Frontend Bootcamp <a href="https://github.com/Microsoft/frontend-bootcamp">View on GitHub</a></h1>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Day 1</h2>
|
||||
Get set up and learn to build a todo app using HTML, CSS, JavaScript, and React.
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<a target="_blank" href="./step1-01/" class="Tile-link">
|
||||
HTML/CSS/JS
|
||||
</a>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Todo HTML & CSS
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-02/demo/">demo</a> | <a target="_blank" href="./step1-02/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-02/final/">final</a>
|
||||
</div>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet"
|
||||
href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.6.1/css/fabric.min.css" />
|
||||
<link rel="stylesheet" href="./assets/shared.css" />
|
||||
<title>Microsoft Days in the Web - Welcome</title>
|
||||
</head>
|
||||
|
||||
<body class="ms-Fabric">
|
||||
<div class="Container">
|
||||
<h1>Frontend Bootcamp <a href="https://github.com/Microsoft/frontend-bootcamp">View on GitHub</a></h1>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Day 1</h2>
|
||||
Get set up and learn to build a todo app using HTML, CSS, JavaScript, and React.
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<a target="_blank" href="./step1-01/" class="Tile-link">
|
||||
HTML/CSS/JS
|
||||
</a>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Todo HTML & CSS
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-02/demo/">demo</a> | <a target="_blank"
|
||||
href="./step1-02/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-02/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Todo JS
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-03/demo/">demo</a> | <a target="_blank" href="./step1-03/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-03/final/">final</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Todo JS
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-03/demo/">demo</a> | <a target="_blank"
|
||||
href="./step1-03/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-03/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
React Intro
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-04/demo/">demo</a> | <a target="_blank" href="./step1-04/final/">final</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
React Intro
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-04/demo/">demo</a> | <a target="_blank" href="./step1-04/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
React Components
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-05/demo/">demo</a> | <a target="_blank" href="./step1-05/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-05/final/">final</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
React Components
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-05/demo/">demo</a> | <a target="_blank"
|
||||
href="./step1-05/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-05/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
State-Driven UI
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-06/demo/">demo</a> | <a target="_blank" href="./step1-06/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-06/final/">final</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
State-Driven UI
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-06/demo/">demo</a> | <a target="_blank"
|
||||
href="./step1-06/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-06/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
UI-Driven State
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-07/demo/">demo</a> | <a target="_blank" href="./step1-07/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-07/final/">final</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
UI-Driven State
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step1-07/demo/">demo</a> | <a target="_blank"
|
||||
href="./step1-07/exercise/">exercise</a> |
|
||||
<a target="_blank" href="./step1-07/final/">final</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Day 2</h2>
|
||||
Take your todo app to the next level with TypeScript, Fabric React, and Redux.
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
TypeScript Basics
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-01/demo/">demo</a> | <a target="_blank" href="./step2-01/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Day 2</h2>
|
||||
Take your todo app to the next level with TypeScript, Fabric React, and Redux.
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
TypeScript Basics
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-01/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-01/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
UI Fabric
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-02/demo/">demo</a> | <a target="_blank" href="./step2-02/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
UI Fabric
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-02/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-02/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Theming and Styling
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-03/demo/">demo</a> | <a target="_blank" href="./step2-03/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Theming and Styling
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-03/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-03/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Testing with jest
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-04/demo/">demo</a> | <a target="_blank" href="./step2-04/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Testing with jest
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-04/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-04/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Reducers
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-05/demo/">demo</a> | <a target="_blank" href="./step2-05/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Reducers
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-05/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-05/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Dispatch Actions
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-06/demo/">demo</a> | <a target="_blank" href="./step2-06/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Dispatch Actions
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-06/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-06/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Connect to UI
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-07/demo/">demo</a> | <a target="_blank" href="./step2-07/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Connect to UI
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-07/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-07/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Combine Reducers
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-08/demo/">demo</a> | <a target="_blank" href="./step2-08/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Combine Reducers
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-08/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-08/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Service Calls
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-09/demo/">demo</a> | <a target="_blank" href="./step2-09/exercise/">exercise</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="Tile Tile--numbered">
|
||||
<div class="Tile-link">
|
||||
Redux: Service Calls
|
||||
<div class="Tile-links">
|
||||
<a target="_blank" href="./step2-09/demo/">demo</a> | <a target="_blank"
|
||||
href="./step2-09/exercise/">exercise</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Playground</h2>
|
||||
Build your app here!
|
||||
</li>
|
||||
<li class="Tile Tile--unnumbered"><a target="_blank" href="/playground/" class="Tile-link">Playground</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<script src="./assets/track.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="Container">
|
||||
<ul class="Tiles">
|
||||
<li class="Tile Tile--intro">
|
||||
<h2>Playground</h2>
|
||||
Build your app here!
|
||||
</li>
|
||||
<li class="Tile Tile--unnumbered"><a target="_blank" href="/playground/" class="Tile-link">Playground</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<script src="./assets/track.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user