minsung

react-failed

...@@ -2,32 +2,18 @@ ...@@ -2,32 +2,18 @@
2 <html lang="en"> 2 <html lang="en">
3 <head> 3 <head>
4 <meta charset="utf-8" /> 4 <meta charset="utf-8" />
5 - <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> 5 + <script src="https://kit.fontawesome.com/6a5db0a2e0.js" crossorigin="anonymous"></script>
6 - <meta name="viewport" content="width=device-width, initial-scale=1" /> 6 + <link rel="icon" href="https://kit.fontawesome.com/6a5db0a2e0.js" />
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 7
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> 8 <title>React App</title>
9 + <div id="Khu-logo">
10 + <a target="_blank" href="./index.html">
11 + <img alt="" src="../img/Khu_Chat_Icon.svg" height="34" title="Khu_chat"></img>
12 + </a>
13 + </div>
28 </head> 14 </head>
29 <body> 15 <body>
30 - <noscript>You need to enable JavaScript to run this app.</noscript> 16 + <i class="far fa-comments fa-7x"></i>
31 <div id="root"></div> 17 <div id="root"></div>
32 <!-- 18 <!--
33 This HTML file is a template. 19 This HTML file is a template.
......
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 -}
1 -# https://www.robotstxt.org/robotstxt.html
2 -User-agent: *
3 -Disallow:
1 -import React from 'react';
2 -import { render } from '@testing-library/react';
3 -import App from './App';
4 -
5 -test('renders learn react link', () => {
6 - const { getByText } = render(<App />);
7 - const linkElement = getByText(/learn react/i);
8 - expect(linkElement).toBeInTheDocument();
9 -});
1 -import { createGlobalStyle } from "./node_modules/styled-components";
2 -import reset from "./node_modules/styled-reset";
3 -
4 -export default createGlobalStyle`
5 - ${reset}
6 - * {
7 - box-sizing: border-box;
8 - }
9 - html, body {
10 - height: 100vh;
11 - }
12 - #root {
13 - height: 100%;
14 - display:flex;
15 - flex-direction: row;
16 - }
17 - @font-face {
18 - font-family: 'Shadows Into Light', cursive;
19 - src: url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap');
20 - }
21 - @font-face {
22 - font-family: 'Kaushan Script', cursive;
23 - src: url('https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap');
24 - }
25 -`;
1 -import defaultProfile from "../imgs/defaultProfile.jpg";
2 -
3 -export default {
4 - bgColor: "white",
5 - shadowFonts: "'Shadows Into Light', cursive",
6 - boxBorder: "1px solid #e6e6e6",
7 - borderRadius: "4px",
8 - defaultProfile: `${defaultProfile}`,
9 -};
1 +<svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="comments" class="svg-inline--fa fa-comments fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M532 386.2c27.5-27.1 44-61.1 44-98.2 0-80-76.5-146.1-176.2-157.9C368.3 72.5 294.3 32 208 32 93.1 32 0 103.6 0 192c0 37 16.5 71 44 98.2-15.3 30.7-37.3 54.5-37.7 54.9-6.3 6.7-8.1 16.5-4.4 25 3.6 8.5 12 14 21.2 14 53.5 0 96.7-20.2 125.2-38.8 9.2 2.1 18.7 3.7 28.4 4.9C208.1 407.6 281.8 448 368 448c20.8 0 40.8-2.4 59.8-6.8C456.3 459.7 499.4 480 553 480c9.2 0 17.5-5.5 21.2-14 3.6-8.5 1.9-18.3-4.4-25-.4-.3-22.5-24.1-37.8-54.8zm-392.8-92.3L122.1 305c-14.1 9.1-28.5 16.3-43.1 21.4 2.7-4.7 5.4-9.7 8-14.8l15.5-31.1L77.7 256C64.2 242.6 48 220.7 48 192c0-60.7 73.3-112 160-112s160 51.3 160 112-73.3 112-160 112c-16.5 0-33-1.9-49-5.6l-19.8-4.5zM498.3 352l-24.7 24.4 15.5 31.1c2.6 5.1 5.3 10.1 8 14.8-14.6-5.1-29-12.3-43.1-21.4l-17.1-11.1-19.9 4.6c-16 3.7-32.5 5.6-49 5.6-54 0-102.2-20.1-131.3-49.7C338 339.5 416 272.9 416 192c0-3.4-.4-6.7-.7-10C479.7 196.5 528 238.8 528 288c0 28.7-16.2 50.6-29.7 64z"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 -body{
2 - background-color: powderblue;
3 -}
...\ No newline at end of file ...\ No newline at end of file
1 import React from 'react'; 1 import React from 'react';
2 import ReactDOM from 'react-dom'; 2 import ReactDOM from 'react-dom';
3 -import './index.css'; 3 +import './mainpage/main.css';
4 -import App from './App'; 4 +
5 -import * as serviceWorker from './serviceWorker'; 5 +import HelloKhu from './mainpage/main';
6 +import KhuIcon from './mainpage/main';
7 +
6 8
7 ReactDOM.render( 9 ReactDOM.render(
8 <React.StrictMode> 10 <React.StrictMode>
9 - <App /> 11 + <HelloKhu/>
12 +
10 </React.StrictMode>, 13 </React.StrictMode>,
11 document.getElementById('root') 14 document.getElementById('root')
12 ); 15 );
13 -
14 -// If you want your app to work offline and load faster, you can change
15 -// unregister() to register() below. Note this comes with some pitfalls.
16 -// Learn more about service workers: https://bit.ly/CRA-PWA
17 -serviceWorker.unregister();
......
1 -import React,{ Component } from 'react';
2 -import './App.css';
3 -
4 -class App extends Component {
5 - render(){
6 - return (
7 - <div className="App">
8 - Hello, React!!
9 - </div>
10 - );
11 - }
12 -}
13 -
14 -
15 -export default App;
1 +body{
2 + background-color: powderblue;
3 +}
4 +
5 +
1 .App { 6 .App {
2 text-align: center; 7 text-align: center;
3 } 8 }
......
1 +import React,{ Component } from 'react';
2 +import './main.css';
3 +
4 +class HelloKhu extends Component {
5 + render(){
6 + return (
7 + <div className="HelloKhu">
8 + Hello, This is Khu!!
9 + </div>
10 + );
11 + }
12 +}
13 +
14 +class KhuIcon extends Component {
15 + render(){
16 + return (
17 + <a target="_blank" href="./index.html">
18 + <img alt="" src="../img/Khu_Chat_Icon.svg" height="34" title="Khu_chat"></img>
19 + </a>
20 +
21 + );
22 + }
23 +}
24 +
25 +export default {
26 + HelloKhu,
27 + KhuIcon
28 +}
1 -import React,{ Component } from 'react';
2 -import ReactDOM from 'react-dom';
3 -import './App.css';
4 -import App from './App';
5 -
6 -
7 -ReactDOM.render(
8 - <React.StrictMode>
9 - <App />
10 - </React.StrictMode>,
11 - document.getElementById('root')
12 -);