https://github.com/dsmith73/quiz-app
trivia app built in react and typescript
https://github.com/dsmith73/quiz-app
dsmith73 quiz react trivia ts typescript
Last synced: 2 months ago
JSON representation
trivia app built in react and typescript
- Host: GitHub
- URL: https://github.com/dsmith73/quiz-app
- Owner: dsmith73
- Created: 2020-07-18T01:03:49.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2020-07-18T01:10:50.000Z (almost 6 years ago)
- Last Synced: 2025-02-22T18:20:33.980Z (over 1 year ago)
- Topics: dsmith73, quiz, react, trivia, ts, typescript
- Language: HTML
- Homepage: https://dsmith73-quiz-app.glitch.me
- Size: 2.13 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# quiz app
https://create-react-app.dev
* `npx create-react-app my-app --template typescript`
* remove all in src/ but App & Index.tsx and react-app-env
* remove references to css in app & index.tsx
* update `
Quiz`
* `npm i styled-components @types/styled-components`
* `npm start`
* launch browser to `localhost:3000`
* webpage comes up - says Quiz
* get background from https://unsplash.com
* create /src/images
* put img in /images
* get some google fonts from https://fonts.google.com
* I selected catamaran, & Emplema One
* ``
* CSS rules `font-family: 'Bungee Inline', cursive;`
`font-family: 'Catamaran', sans-serif;`
* get the embed links & add to index.html
* check out the site to use for questions https://opentdb.com
* make your api selections and get the api link
* `https://opentdb.com/api.php?amount=10&type=multiple`
* create src/components
* create components/QuestionCard.tsx and populate
* create src/API.ts
* create src/utils.ts
* update App.tsx
* we'll be using arrow functions for this implementation
* `function App()` to `const App = () =>`
* update QuestionCard.tsx
* update API.ts
*