├── index.html
├── style.scss
├── index.tsx
├── src
    └── app.tsx
├── README.md
└── package.json


/index.html:
--------------------------------------------------------------------------------
1 | <div id="root"></div>


--------------------------------------------------------------------------------
/style.scss:
--------------------------------------------------------------------------------
1 | h1, p {
2 |   font-family: Lato;
3 | }


--------------------------------------------------------------------------------
/index.tsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { render } from 'react-dom';
3 | import './style.scss';
4 | import App from './src/app';
5 | 
6 | render(<App />, document.getElementById('root'));
7 | 


--------------------------------------------------------------------------------
/src/app.tsx:
--------------------------------------------------------------------------------
 1 | import React, { useState } from 'react';
 2 | 
 3 | function Counter() {
 4 |   const [count,setCount] = useState(0);
 5 | 
 6 |   function increase() {
 7 |     setCount(count+1);
 8 |   }
 9 | 
10 |   return(
11 |     <div>
12 |       My Count is {count} <br/>
13 |       <button onClick={increase}>+</button>
14 |     </div>
15 |   )
16 | }
17 | 
18 | function App() {
19 | return (
20 |   <div>
21 |     <Counter/>
22 |   </div>
23 | );
24 | }
25 | 
26 | export default App;
27 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # react-ts-usestate
 2 | 
 3 | ```js
 4 | import React, { useState } from 'react';
 5 | 
 6 | function Counter() {
 7 |   const [count,setCount] = useState(0);
 8 | 
 9 |   function increase() {
10 |     setCount(count+1);
11 |   }
12 | 
13 |   return(
14 |     <div>
15 |       My Count is {count} <br/>
16 |       <button onClick={increase}>+</button>
17 |     </div>
18 |   )
19 | }
20 | 
21 | function App() {
22 | return (
23 |   <div>
24 |     <Counter/>
25 |   </div>
26 | );
27 | }
28 | 
29 | export default App;
30 | 
31 | ```
32 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "react-ts",
 3 |   "version": "0.0.0",
 4 |   "private": true,
 5 |   "dependencies": {
 6 |     "@popperjs/core": "^2.9.2",
 7 |     "@types/react": "^17.0.14",
 8 |     "@types/react-dom": "^17.0.9",
 9 |     "bootstrap": "^5.0.2",
10 |     "node-sass": "^6.0.1",
11 |     "react": "^17.0.2",
12 |     "react-bootstrap": "^1.6.1",
13 |     "react-dom": "^17.0.2"
14 |   },
15 |   "scripts": {
16 |     "start": "react-scripts-ts start",
17 |     "build": "react-scripts-ts build",
18 |     "test": "react-scripts-ts test --env=jsdom",
19 |     "eject": "react-scripts-ts eject"
20 |   },
21 |   "devDependencies": {
22 |     "react-scripts-ts": "latest"
23 |   }
24 | }


--------------------------------------------------------------------------------