In the process of linking backend and UI

This commit is contained in:
Aaron Sun 2019-09-24 14:38:13 -04:00
parent 6f94623d0c
commit e2883a04c5
10 changed files with 63 additions and 23 deletions

View File

@ -2016,6 +2016,43 @@
"resolved": "https://registry.npmjs.org/aws4/-/aws4-1.8.0.tgz",
"integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ=="
},
"axios": {
"version": "0.19.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
"integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
"requires": {
"follow-redirects": "1.5.10",
"is-buffer": "^2.0.2"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"requires": {
"ms": "2.0.0"
}
},
"follow-redirects": {
"version": "1.5.10",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"is-buffer": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.3.tgz",
"integrity": "sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw=="
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
}
}
},
"axobject-query": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.0.2.tgz",

View File

@ -4,6 +4,7 @@
"private": true,
"dependencies": {
"@material-ui/core": "^4.4.3",
"axios": "^0.19.0",
"react": "^16.9.0",
"react-dom": "^16.9.0",
"react-router-dom": "^5.0.1",
@ -27,5 +28,6 @@
"last 1 firefox version",
"last 1 safari version"
]
}
},
"proxy": "https://us-central1-socialape-2619.cloudfunctions.net/api"
}

View File

@ -5,6 +5,13 @@
<head>
<meta charset="utf-8">
<title>Twistter</title>
<style>
body {
margin: 0;
padding: 0;
font-family: sans-serif;
}
</style>
</head>
<body>

View File

@ -37,7 +37,4 @@
.authInput {
background-color: #eee;
width:500px;
height:40px;
border: 0px;
padding: 10px;
}

View File

@ -13,16 +13,12 @@ class App extends Component {
return (
<Router>
<div className="app">
<Route exact path="/" component={home}/>
<Route exact path="/register" component={register}/>
<Route exact path="/login" component={login}/>
</div>
</Router>
);
}

View File

@ -3,6 +3,7 @@ import './App.css';
import logo from './twistter-logo.png';
class Home extends Component {
render() {
return (
@ -23,7 +24,7 @@ class Home extends Component {
<form action="./register">
<button className="authButtons register">Sign up</button>
</form>
<br/><br/>
<br/>
<form action="./login">
<button className="authButtons login">Sign in</button>
</form>

View File

@ -2,6 +2,9 @@ import React, { Component } from 'react';
import './App.css';
import logo from './twistter-logo.png';
import TextField from '@material-ui/core/TextField';
import axios from 'axios';
class Login extends Component {
render() {
@ -11,14 +14,14 @@ class Login extends Component {
<br/><br/>
<b>Log in to Twistter</b>
<br/><br/>
<input class="authInput" placeholder="Username or email"></input>
<TextField className="authInput" id="email" name="email" label="Email" />
<br/><br/>
<input class="authInput" placeholder="Password"></input>
<TextField className="authInput" id="password" name="password" label="Password" />
<br/><br/>
<button class="authButtons register">Sign in</button>
<button className="authButtons register" type="submit">Sign in</button>
</div>
);
}
};
}
export default Login;

View File

@ -2,6 +2,9 @@ import React, { Component } from 'react';
import './App.css';
import logo from './twistter-logo.png';
import TextField from '@material-ui/core/TextField';
//import axios from 'axios';
class Register extends Component {
render() {
@ -11,13 +14,13 @@ class Register extends Component {
<br/><br/>
<b>Create your account</b>
<br/><br/>
<input class="authInput" id="email" placeholder="Email"></input>
<TextField className="authInput" id="email" name="email" label="Email" />
<br/><br/>
<input class="authInput" id="username" placeholder="Username"></input>
<TextField className="authInput" id="username" name="username" label="Username" />
<br/><br/>
<input class="authInput" id="password" placeholder="Password"></input>
<TextField className="authInput" id="password" name="password" label="Password" />
<br/><br/>
<input class="authInput" id="confirmPassword" placeholder="Confirm Password"></input>
<TextField className="authInput" id="confirmPassword" name="confirmPassword" label="Confirm Password" />
<br/><br/>
<button class="authButtons register" id="submit">Sign up</button>
</div>

View File

@ -1,5 +0,0 @@
body {
margin: 0;
padding: 0;
font-family: sans-serif;
}

View File

@ -1,7 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';
ReactDOM.render(
<App />,