|
| 1 | +<a href="https://totaltypescript.com/tutorials/react-with-typescript"><img src="https://res.cloudinary.com/total-typescript/image/upload/v1683647787/react-with-typescript_p2dgf5.png" alt="React with TypeScript, tutorial by Matt Pocock" /></a> |
| 2 | + |
| 3 | +## Quickstart |
| 4 | + |
| 5 | +Clone this repo or [open in Gitpod](https://gitpod.io/#https://github.com/total-typescript/error-messages-tutorial). |
| 6 | + |
| 7 | +```sh |
| 8 | +# Installs all dependencies |
| 9 | +npm install |
| 10 | + |
| 11 | +# Starts the first exercise |
| 12 | +npm run exercise 01 |
| 13 | + |
| 14 | +# Runs linting and tests on the solution |
| 15 | +npm run solution 01 |
| 16 | +``` |
| 17 | + |
| 18 | +## How to take the course |
| 19 | + |
| 20 | +You'll notice that the course is split into exercises. Each exercise is split into a `*.problem.ts` and a `*.solution.ts`. |
| 21 | + |
| 22 | +To take an exercise: |
| 23 | + |
| 24 | +1. Go into `*.problem.ts` |
| 25 | +2. Run `npm run exercise 01`, where `01` is the number of the exercise you're on. |
| 26 | + |
| 27 | +The `exercise` script will run TypeScript typechecks and a test suite on the exercise. |
| 28 | + |
| 29 | +This course encourages **active, exploratory learning**. In the video, I'll explain a problem, and **you'll be asked to try to find a solution**. To attempt a solution, you'll need to: |
| 30 | + |
| 31 | +1. Check out [TypeScript's docs](https://www.typescriptlang.org/docs/handbook/intro.html) or the [React TypeScript cheatsheet](https://react-typescript-cheatsheet.netlify.app/) |
| 32 | +1. Try to find something that looks relevant. |
| 33 | +1. Give it a go to see if it solves the problem. |
| 34 | + |
| 35 | +You'll know if you've succeeded because the tests will pass. |
| 36 | + |
| 37 | +**If you succeed**, or **if you get stuck**, unpause the video and check out the `*.solution.ts`. You can see if your solution is better or worse than mine! |
| 38 | + |
| 39 | +You can run `npm run solution 01` to run the tests and typechecking on the solution. |
| 40 | + |
| 41 | +## Acknowledgements |
| 42 | + |
| 43 | +Say thanks to Matt on [Twitter](https://twitter.com/mattpocockuk) or by joining his [Discord](https://discord.gg/8S5ujhfTB3). Consider signing up to his [Total TypeScript course](https://totaltypescript.com). |
| 44 | + |
| 45 | +## Reference |
| 46 | + |
| 47 | +### `npm run exercise 01` |
| 48 | + |
| 49 | +Alias: `npm run e 01` |
| 50 | + |
| 51 | +Run the corresponding `*.problem.ts` file. |
| 52 | + |
| 53 | +### `npm run solution 01` |
| 54 | + |
| 55 | +Alias: `npm run s 01` |
| 56 | + |
| 57 | +Run the corresponding `*.solution.ts` file. If there are multiple, it runs only the first one. |
0 commit comments