created components matching the wireframe

This commit is contained in:
soyed 2021-03-28 17:20:05 -04:00
parent 4d2ebac513
commit a2a1af5d05
4 changed files with 19783 additions and 51 deletions

19772
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -6,6 +6,7 @@
"@testing-library/jest-dom": "^5.11.10", "@testing-library/jest-dom": "^5.11.10",
"@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-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-scripts": "4.0.3", "react-scripts": "4.0.3",

View file

@ -1,25 +1,31 @@
import logo from './logo.svg'; import { Component } from "react";
import './App.css';
function App() { class App extends Component {
return ( render() {
<div className="App"> return (
<header className="App-header"> <div className="App">
<img src={logo} className="App-logo" alt="logo" /> <header className="App-header">
<p> <h1>Kene's Crib</h1>
Edit <code>src/App.js</code> and save to reload. <p>Real Website loading.......</p>
</p> </header>
<a <section>
className="App-link" <h1>hello everyone</h1>
href="https://reactjs.org" <div class="alert alert-primary" role="alert">
target="_blank" A simple primary alertcheck it out!
rel="noopener noreferrer" </div>
> <div class="alert alert-primary" role="alert">
Learn React A simple primary alertcheck it out!
</a> </div>
</header> <div class="alert alert-primary" role="alert">
</div> A simple primary alertcheck it out!
); </div>
<div class="alert alert-primary" role="alert">
A simple primary alertcheck it out!
</div>
</section>
</div>
);
}
} }
export default App; export default App;

View file

@ -1,14 +1,15 @@
import React from 'react'; 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'; import reportWebVitals from "./reportWebVitals";
import "bootstrap/dist/css/bootstrap.min.css";
ReactDOM.render( ReactDOM.render(
<React.StrictMode> <React.StrictMode>
<App /> <App />
</React.StrictMode>, </React.StrictMode>,
document.getElementById('root') document.getElementById("root")
); );
// If you want to start measuring performance in your app, pass a function // If you want to start measuring performance in your app, pass a function