mirror of
https://github.com/idanoo/GoScrobble.git
synced 2024-11-22 00:21:55 +00:00
Frontend work
This commit is contained in:
parent
6ab1b13ea3
commit
2fe9516fc2
851
web/package-lock.json
generated
851
web/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -6,9 +6,13 @@
|
|||||||
"@testing-library/jest-dom": "^5.11.9",
|
"@testing-library/jest-dom": "^5.11.9",
|
||||||
"@testing-library/react": "^11.2.5",
|
"@testing-library/react": "^11.2.5",
|
||||||
"@testing-library/user-event": "^12.8.3",
|
"@testing-library/user-event": "^12.8.3",
|
||||||
|
"bootstrap": "^4.6.0",
|
||||||
"react": "^17.0.2",
|
"react": "^17.0.2",
|
||||||
|
"react-bootstrap": "^1.5.2",
|
||||||
"react-dom": "^17.0.2",
|
"react-dom": "^17.0.2",
|
||||||
|
"react-router-dom": "^5.2.0",
|
||||||
"react-scripts": "4.0.3",
|
"react-scripts": "4.0.3",
|
||||||
|
"reactstrap": "^8.9.0",
|
||||||
"web-vitals": "^1.1.1"
|
"web-vitals": "^1.1.1"
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
<meta name="theme-color" content="#000000" />
|
<meta name="theme-color" content="#000000" />
|
||||||
<meta
|
<meta
|
||||||
name="description"
|
name="description"
|
||||||
content="Web site created using create-react-app"
|
content="GoScrobble.com Open source music scropbbler"
|
||||||
/>
|
/>
|
||||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||||
<!--
|
<!--
|
||||||
@ -24,7 +24,7 @@
|
|||||||
work correctly both with client-side routing and a non-root public URL.
|
work correctly both with client-side routing and a non-root public URL.
|
||||||
Learn how to configure a non-root public URL by running `npm run build`.
|
Learn how to configure a non-root public URL by running `npm run build`.
|
||||||
-->
|
-->
|
||||||
<title>React App</title>
|
<title>GoScrobble</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||||
|
@ -1,24 +1,36 @@
|
|||||||
import logo from './logo.svg';
|
|
||||||
import './App.css';
|
import './App.css';
|
||||||
|
import Home from './Components/Pages/Home';
|
||||||
|
import About from './Components/Pages/About';
|
||||||
|
import Login from './Components/Pages/Login';
|
||||||
|
import Navigation from './Components/Pages/Navigation';
|
||||||
|
import { Route, Switch, HashRouter } from 'react-router-dom';
|
||||||
|
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
|
|
||||||
|
if (!true) {
|
||||||
|
return <Login />
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="App">
|
<HashRouter>
|
||||||
<header className="App-header">
|
<div className="wrapper">
|
||||||
<img src={logo} className="App-logo" alt="logo" />
|
<Navigation />
|
||||||
<p>
|
<Switch>
|
||||||
goscrobble.com
|
<Route exact path="/" component={Home} />
|
||||||
</p>
|
<Route path="/about" component={About} />
|
||||||
<a
|
</Switch>
|
||||||
className="App-link"
|
</div>
|
||||||
href="https://git.m2.nz/idanoo/go-scrobble"
|
</HashRouter>
|
||||||
target="_blank"
|
// <div className="App">
|
||||||
rel="noopener noreferrer"
|
// <Router>
|
||||||
>
|
// <Navigation/>
|
||||||
git.m2.nz/idanoo/go-scrobble
|
// <Switch>
|
||||||
</a>
|
// <Route exact path='/' component={Home}/>
|
||||||
</header>
|
// <Route path='/about' component={About}/>
|
||||||
</div>
|
// </Switch>
|
||||||
|
// </Router>
|
||||||
|
// </div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
23
web/src/Components/Pages/About.js
Normal file
23
web/src/Components/Pages/About.js
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import logo from '../../logo.svg';
|
||||||
|
import '../../App.css';
|
||||||
|
|
||||||
|
function About() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<img src={logo} className="App-logo" alt="logo" />
|
||||||
|
<p>
|
||||||
|
TEST!!!
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
className="App-link"
|
||||||
|
href="https://git.m2.nz/idanoo/go-scrobble"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>
|
||||||
|
TEST@!@@
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default About;
|
23
web/src/Components/Pages/Home.js
Normal file
23
web/src/Components/Pages/Home.js
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import logo from '../../logo.svg';
|
||||||
|
import '../../App.css';
|
||||||
|
|
||||||
|
function Home() {
|
||||||
|
return (
|
||||||
|
<div className="App-header">
|
||||||
|
<img src={logo} className="App-logo" alt="logo" />
|
||||||
|
<p>
|
||||||
|
goscrobble.com
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
className="App-link"
|
||||||
|
href="https://git.m2.nz/idanoo/go-scrobble"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>
|
||||||
|
git.m2.nz/idanoo/go-scrobble
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Home;
|
22
web/src/Components/Pages/Login.js
Normal file
22
web/src/Components/Pages/Login.js
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
export default function Login() {
|
||||||
|
return(
|
||||||
|
<div className="login-wrapper">
|
||||||
|
<h1>Please Log In</h1>
|
||||||
|
<form>
|
||||||
|
<label>
|
||||||
|
<p>Username</p>
|
||||||
|
<input type="text" />
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<p>Password</p>
|
||||||
|
<input type="password" />
|
||||||
|
</label>
|
||||||
|
<div>
|
||||||
|
<button type="submit">Submit</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
16
web/src/Components/Pages/Navigation.js
Normal file
16
web/src/Components/Pages/Navigation.js
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { Navbar, NavbarBrand, NavLink } from 'reactstrap';
|
||||||
|
|
||||||
|
const Navigation = () => {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Navbar color="dark" dark fixed="top">
|
||||||
|
<NavbarBrand exact href="/" className="mr-auto">GoScrobble</NavbarBrand>
|
||||||
|
<NavLink exact href="/">Home</NavLink>
|
||||||
|
<NavLink href="/about">About</NavLink>
|
||||||
|
</Navbar>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Navigation;
|
@ -2,7 +2,6 @@ import React from 'react';
|
|||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import './index.css';
|
import './index.css';
|
||||||
import App from './App';
|
import App from './App';
|
||||||
import reportWebVitals from './reportWebVitals';
|
|
||||||
|
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
@ -10,8 +9,3 @@ ReactDOM.render(
|
|||||||
</React.StrictMode>,
|
</React.StrictMode>,
|
||||||
document.getElementById('root')
|
document.getElementById('root')
|
||||||
);
|
);
|
||||||
|
|
||||||
// If you want to start measuring performance in your app, pass a function
|
|
||||||
// to log results (for example: reportWebVitals(console.log))
|
|
||||||
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
|
|
||||||
reportWebVitals();
|
|
||||||
|
Loading…
Reference in New Issue
Block a user