奥运Flippy卡片的乐趣！___下载.zip

# An app all about the 2020 Tokyo Olympics, postponed to Summer 2021! Using Vite, Vanilla JS, and CSS Grid, let's create a card-flipping app! Vite will handle the architecture and module bundling, we will use Vanilla JS to avoid framework fatigue, and use CSS Grid for responsive design needs. The actual card flipping can be done using plain old CSS transforms. To run this app out of the box, make sure you have Node and NPM installed locally (see below for links). Fork the 'main' branch, navigate to the app root and, in your command line or terminal, type: `npm i` to install dependencies. Then, type `npm run dev` to run the app locally (usually on localhost:3000). Since the app only uses Vite and no other framework, your dependency install is lightweight. <img width="640" alt="screenshot" src="https://user-images.githubusercontent.com/1450004/117545887-af6df780-aff5-11eb-89cd-a8574aae6d27.png"> --- ## Resources: Npm: [https://npmjs.com](https://www.npmjs.com/) Node: [https://nodejs.org](https://nodejs.org/) Vite: [About Vite](https://vitejs.dev/guide/) The [Tokyo Olympics 2020](https://olympics.com/) web site (source of the sports event data) Free [CSS Grid Course](https://cssgrid.io/) Learn [how to develop applications](https://docs.microsoft.com/en-us/learn/paths/build-javascript-applications-nodejs/?WT.mc_id=academic-26883-jelooper) using node.js [JavaScript basics video series](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=academic-26883-jelooper) [Free full course on web development](https://aka.ms/webdev-beginners) Build a [terrarium with JS/CSS/HTML](https://aka.ms/terrarium)