Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit059e004

Browse files
committed
init with coderoad react tutorial starter
0 parents  commit059e004

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+
returnconfig;
10+
},
11+
devServer:config=>{
12+
returnconfig;
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+
returnpaths;
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+
<htmllang="en">
3+
<head>
4+
<metacharset="utf-8"/>
5+
<linkrel="icon"href="%PUBLIC_URL%/favicon.ico"/>
6+
<metaname="viewport"content="width=device-width, initial-scale=1"/>
7+
<metaname="theme-color"content="#000000"/>
8+
<meta
9+
name="description"
10+
content="Web site created using create-react-app"
11+
/>
12+
<linkrel="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+
<linkrel="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+
<divid="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

‎public/logo512.png

9.44 KB
Loading

‎public/manifest.json

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"short_name":"React App",
3+
"name":"Create React App Sample",
4+
"icons": [
5+
{
6+
"src":"favicon.ico",
7+
"sizes":"64x64 32x32 24x24 16x16",
8+
"type":"image/x-icon"
9+
},
10+
{
11+
"src":"logo192.png",
12+
"type":"image/png",
13+
"sizes":"192x192"
14+
},
15+
{
16+
"src":"logo512.png",
17+
"type":"image/png",
18+
"sizes":"512x512"
19+
}
20+
],
21+
"start_url":".",
22+
"display":"standalone",
23+
"theme_color":"#000000",
24+
"background_color":"#ffffff"
25+
}

‎public/robots.txt

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# https://www.robotstxt.org/robotstxt.html
2+
User-agent:*

‎src/App.css

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
.App {
2+
text-align: center;
3+
}
4+
5+
.App-logo {
6+
height:40vmin;
7+
pointer-events: none;
8+
}
9+
10+
@media (prefers-reduced-motion: no-preference) {
11+
.App-logo {
12+
animation: App-logo-spin infinite20s linear;
13+
}
14+
}
15+
16+
.App-header {
17+
background-color:#282c34;
18+
min-height:100vh;
19+
display: flex;
20+
flex-direction: column;
21+
align-items: center;
22+
justify-content: center;
23+
font-size:calc(10px+2vmin);
24+
color: white;
25+
}
26+
27+
.App-link {
28+
color:#61dafb;
29+
}
30+
31+
@keyframes App-logo-spin {
32+
from {
33+
transform:rotate(0deg);
34+
}
35+
to {
36+
transform:rotate(360deg);
37+
}
38+
}

‎src/App.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
importReactfrom"react";
2+
3+
constApp=()=>{
4+
return<div>Welcome to CodeRoad</div>;
5+
};
6+
7+
exportdefaultApp;

‎src/index.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
importReactfrom"react";
2+
importReactDOMfrom"react-dom";
3+
import"./styles/index.css";
4+
importAppfrom"./App";
5+
6+
ReactDOM.render(<App/>,document.getElementById("root"));

‎src/styles/index.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
body {
2+
margin:0;
3+
font-family: -apple-system, BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen",
4+
"Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",
5+
sans-serif;
6+
-webkit-font-smoothing: antialiased;
7+
-moz-osx-font-smoothing: grayscale;
8+
}
9+
10+
code {
11+
font-family: source-code-pro, Menlo, Monaco, Consolas,"Courier New",
12+
monospace;
13+
}

‎src/tests/App.test.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
test("Tests working",()=>{
2+
expect(1+1).toBe(2);
3+
});

‎src/tests/setupTests.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// jest-dom adds custom jest matchers for asserting on DOM nodes.
2+
// allows you to do things like:
3+
// expect(element).toHaveTextContent(/react/i)
4+
// learn more: https://github.com/testing-library/jest-dom
5+
import"@testing-library/jest-dom/extend-expect";

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp