Skip to content

Commit 059e004

Browse files
committed
init with coderoad react tutorial starter
0 parents  commit 059e004

19 files changed

+368
-0
lines changed

.gitignore

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
# misc
15+
.DS_Store
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*
24+
25+
# ignore to avoid merge conflicts in CodeRoad
26+
package-lock.json
27+
yarn.lock
28+
29+
# Notes
30+
CODEROAD.md

.vscode/extensions.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
// See http://go.microsoft.com/fwlink/?LinkId=827846
3+
// for the documentation about the extensions.json format
4+
"recommendations": ["dbaeumer.vscode-eslint", "msjsdiag.debugger-for-chrome"]
5+
}

.vscode/launch.json

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"version": "0.2.0",
3+
"configurations": [
4+
{
5+
// run Chrome with the VSCode debugger
6+
"name": "Chrome",
7+
"type": "chrome",
8+
"request": "launch",
9+
"url": "http://localhost:3000",
10+
"webRoot": "${workspaceFolder}/src",
11+
"sourceMapPathOverrides": {
12+
"webpack:///src/*": "${webRoot}/*"
13+
}
14+
}
15+
]
16+
}

.vscode/settings.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"editor.formatOnSave": true,
3+
"editor.codeActionsOnSave": {
4+
"source.organizeImports": false,
5+
"source.fixAll": true
6+
},
7+
"eslint.validate": [
8+
"javascript",
9+
"javascriptreact",
10+
"typescript",
11+
"typescriptreact"
12+
]
13+
}

README.md

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
# CodeRoad Tutorial React Starter
2+
3+
This project is a working starter boilerplate for a React based CodeRoad tutorial.
4+
5+
See [instructions for reverting back](#Revert-to-Create-React-App) to its original [Create React App](https://github.com/facebook/create-react-app) template.
6+
7+
## Available Scripts
8+
9+
In the project directory, you can run:
10+
11+
### `yarn start`
12+
13+
Runs the app in the development mode.<br />
14+
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
15+
16+
The page will reload if you make edits.<br />
17+
You will also see any lint errors in the console.
18+
19+
### `yarn test`
20+
21+
Launches the test runner in the interactive watch mode.<br />
22+
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
23+
24+
### `yarn build`
25+
26+
Builds the app for production to the `build` folder.<br />
27+
It correctly bundles React in production mode and optimizes the build for the best performance.
28+
29+
The build is minified and the filenames include the hashes.<br />
30+
Your app is ready to be deployed!
31+
32+
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
33+
34+
## Learn More
35+
36+
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
37+
38+
To learn React, check out the [React documentation](https://reactjs.org/).
39+
40+
### Code Splitting
41+
42+
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
43+
44+
### Analyzing the Bundle Size
45+
46+
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
47+
48+
### Making a Progressive Web App
49+
50+
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
51+
52+
### Advanced Configuration
53+
54+
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
55+
56+
### Deployment
57+
58+
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
59+
60+
### `yarn build` fails to minify
61+
62+
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
63+
64+
## Revert to Create-React-App
65+
66+
This project is slightly modified from the original create-react-app config in order to integrate with CodeRoad's testing tools. See react-app-rewired for details on how these modifications are implemented: https://github.com/timarney/react-app-rewired.
67+
68+
If you're done with your CodeRoad course, feel free to revert back. Just follow the instructions below:
69+
70+
1. delete the following file: `config.overrides.js`
71+
2. Remove unused packages by running the following:
72+
73+
```shell
74+
npm uninstall react-app-rewired jest-tap-reporter
75+
```
76+
77+
3. Revert the scripts in package.json back to their original formats:
78+
79+
```json
80+
"scripts": {
81+
"start": "react-scripts start",
82+
"build": "react-scripts build",
83+
"test": "react-scripts test"
84+
},
85+
```
86+
87+
4. Remove the following lines from your `.gitignore` file. These should be enabled when publishing or sharing your application.
88+
89+
```ms
90+
package-lock.json
91+
yarn.lock
92+
```
93+
94+
Happy hacking!

config-overrides.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
/*
2+
Config is overwritten for the CodeRoad integration
3+
because of the need to change the Jest reporter on tests.
4+
See the README for details on how to revert back.
5+
*/
6+
7+
module.exports = {
8+
webpack: config => {
9+
return config;
10+
},
11+
devServer: config => {
12+
return config;
13+
},
14+
jest: config => ({
15+
...config,
16+
// stop running tests after `n` failures
17+
bail: 1,
18+
// use jest-tap-reporter with CodeRoad tests
19+
reporters: ["jest-tap-reporter"],
20+
// disable test coverage collection for performance
21+
collectCoverage: false,
22+
collectCoverageFrom: [],
23+
// add a test setup file if need
24+
setupFilesAfterEnv: ["./src/tests/setupTests.js"],
25+
// unused fields with CodeRoad
26+
watchPlugins: []
27+
}),
28+
paths(paths, env) {
29+
return paths;
30+
}
31+
};

package.json

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"name": "coderoad-react-tutorial-starter",
3+
"version": "0.1.0",
4+
"private": true,
5+
"scripts": {
6+
"build": "react-app-rewired build",
7+
"start": "react-app-rewired start",
8+
"test": "react-app-rewired test --watchAll=false"
9+
},
10+
"browserslist": {
11+
"production": [
12+
">0.2%",
13+
"not dead",
14+
"not op_mini all"
15+
],
16+
"development": [
17+
"last 1 chrome version",
18+
"last 1 firefox version",
19+
"last 1 safari version"
20+
]
21+
},
22+
"eslintConfig": {
23+
"extends": "react-app"
24+
},
25+
"dependencies": {
26+
"@testing-library/jest-dom": "^4.2.4",
27+
"@testing-library/react": "^9.4.0",
28+
"@testing-library/user-event": "^8.0.2",
29+
"react": "^16.12.0",
30+
"react-dom": "^16.12.0",
31+
"react-scripts": "^3.3.0"
32+
},
33+
"devDependencies": {
34+
"jest-tap-reporter": "^1.9.0",
35+
"react-app-rewired": "^2.1.5"
36+
}
37+
}

public/favicon.ico

3.78 KB
Binary file not shown.

public/index.html

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="theme-color" content="#000000" />
8+
<meta
9+
name="description"
10+
content="Web site created using create-react-app"
11+
/>
12+
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
13+
<!--
14+
manifest.json provides metadata used when your web app is installed on a
15+
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
16+
-->
17+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18+
<!--
19+
Notice the use of %PUBLIC_URL% in the tags above.
20+
It will be replaced with the URL of the `public` folder during the build.
21+
Only files inside the `public` folder can be referenced from the HTML.
22+
23+
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24+
work correctly both with client-side routing and a non-root public URL.
25+
Learn how to configure a non-root public URL by running `npm run build`.
26+
-->
27+
<title>React App</title>
28+
</head>
29+
<body>
30+
<noscript>You need to enable JavaScript to run this app.</noscript>
31+
<div id="root"></div>
32+
<!--
33+
This HTML file is a template.
34+
If you open it directly in the browser, you will see an empty page.
35+
36+
You can add webfonts, meta tags, or analytics to this file.
37+
The build step will place the bundled scripts into the <body> tag.
38+
39+
To begin the development, run `npm start` or `yarn start`.
40+
To create a production bundle, use `npm run build` or `yarn build`.
41+
-->
42+
</body>
43+
</html>

public/logo192.png

5.22 KB
Loading

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy