Create components, urls and homepage routing

This commit is contained in:
Reckless_Satoshi 2022-01-01 16:19:18 -08:00
parent e83f0295a5
commit 1105f70f20
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
11 changed files with 223 additions and 2 deletions

View File

@ -1,13 +1,19 @@
import React, { Component } from "react";
import { render } from "react-dom";
import HomePage from "./HomePage";
export default class App extends Component {
constructor(props) {
super(props);
}
render() {
return <h1>React Test</h1>;
return (
<div>
<HomePage />
</div>
);
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class BookPage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the order book page</p>;
}
}

View File

@ -0,0 +1,31 @@
import React, { Component } from "react";
import { BrowserRouter as Router, Switch, Route, Link, Redirect } from "react-router-dom";
import NickGenPage from "./NickGenPage";
import LoginPage from "./LoginPage.js";
import MakerPage from "./MakerPage";
import BookPage from "./BookPage";
import OrderPage from "./OrderPage";
import WaitingRoomPage from "./WaitingRoomPage";
export default class HomePage extends Component {
constructor(props) {
super(props);
}
render() {
return (
<Router >
<Switch>
<Route path='' component={NickGenPage}/>
<Route path='/home'><p>You are at the start page</p></Route>
<Route path='/login'component={LoginPage}/>
<Route path='/make' component={MakerPage}/>
<Route path='/book' component={BookPage}/>
<Route path='/order' component={OrderPage}/>
<Route path='/wait' component={WaitingRoomPage}/>
</Switch>
</Router>
);
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class LoginPage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the login page</p>;
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class MakePage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the order maker page</p>;
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class NickGenPage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the landing and user generator page</p>;
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class OrderPage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the single order detail view page</p>;
}
}

View File

@ -0,0 +1,11 @@
import React, { Component } from "react";
export default class WaitingRoomPage extends Component {
constructor(props) {
super(props);
}
render() {
return <p>This is the waiting room</p>;
}
}

File diff suppressed because one or more lines are too long

View File

@ -6,10 +6,38 @@
!*** ./src/components/App.js ***!
\*******************************/
/*!************************************!*\
!*** ./src/components/BookPage.js ***!
\************************************/
/*!************************************!*\
!*** ./src/components/HomePage.js ***!
\************************************/
/*!*************************************!*\
!*** ./node_modules/react/index.js ***!
\*************************************/
/*!*************************************!*\
!*** ./src/components/LoginPage.js ***!
\*************************************/
/*!*************************************!*\
!*** ./src/components/MakerPage.js ***!
\*************************************/
/*!*************************************!*\
!*** ./src/components/OrderPage.js ***!
\*************************************/
/*!***************************************!*\
!*** ./node_modules/isarray/index.js ***!
\***************************************/
/*!***************************************!*\
!*** ./src/components/NickGenPage.js ***!
\***************************************/
/*!*****************************************!*\
!*** ./node_modules/react-dom/index.js ***!
\*****************************************/
@ -18,14 +46,58 @@
!*** ./node_modules/scheduler/index.js ***!
\*****************************************/
/*!******************************************!*\
!*** ./node_modules/prop-types/index.js ***!
\******************************************/
/*!*******************************************!*\
!*** ./src/components/WaitingRoomPage.js ***!
\*******************************************/
/*!*********************************************!*\
!*** ./node_modules/history/esm/history.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/object-assign/index.js ***!
\*********************************************/
/*!**********************************************!*\
!*** ./node_modules/path-to-regexp/index.js ***!
\**********************************************/
/*!*****************************************************!*\
!*** ./node_modules/value-equal/esm/value-equal.js ***!
\*****************************************************/
/*!*******************************************************!*\
!*** ./node_modules/react-router/esm/react-router.js ***!
\*******************************************************/
/*!********************************************************!*\
!*** ./node_modules/react/cjs/react.production.min.js ***!
\********************************************************/
/*!************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/extends.js ***!
\************************************************************/
/*!*************************************************************!*\
!*** ./node_modules/prop-types/factoryWithThrowingShims.js ***!
\*************************************************************/
/*!*************************************************************!*\
!*** ./node_modules/prop-types/lib/ReactPropTypesSecret.js ***!
\*************************************************************/
/*!***************************************************************!*\
!*** ./node_modules/react-router-dom/esm/react-router-dom.js ***!
\***************************************************************/
/*!***************************************************************!*\
!*** ./node_modules/resolve-pathname/esm/resolve-pathname.js ***!
\***************************************************************/
/*!****************************************************************!*\
!*** ./node_modules/react-dom/cjs/react-dom.production.min.js ***!
\****************************************************************/
@ -33,3 +105,43 @@
/*!****************************************************************!*\
!*** ./node_modules/scheduler/cjs/scheduler.production.min.js ***!
\****************************************************************/
/*!****************************************************************!*\
!*** ./node_modules/tiny-invariant/dist/tiny-invariant.esm.js ***!
\****************************************************************/
/*!******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/inheritsLoose.js ***!
\******************************************************************/
/*!******************************************************************!*\
!*** ./node_modules/mini-create-react-context/dist/esm/index.js ***!
\******************************************************************/
/*!******************************************************************!*\
!*** ./node_modules/react-router/node_modules/react-is/index.js ***!
\******************************************************************/
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js ***!
\*******************************************************************/
/*!*****************************************************************************!*\
!*** ./node_modules/hoist-non-react-statics/node_modules/react-is/index.js ***!
\*****************************************************************************/
/*!*********************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js ***!
\*********************************************************************************/
/*!**********************************************************************************!*\
!*** ./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js ***!
\**********************************************************************************/
/*!****************************************************************************************!*\
!*** ./node_modules/react-router/node_modules/react-is/cjs/react-is.production.min.js ***!
\****************************************************************************************/
/*!***************************************************************************************************!*\
!*** ./node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js ***!
\***************************************************************************************************/

View File

@ -3,4 +3,10 @@ from .views import index
urlpatterns = [
path('', index),
path('home/', index),
path('login/', index),
path('make/', index),
path('book/', index),
path('order/', index),
path('wait/', index),
]