diff --git a/ReactJS/alfaprentice/package-lock.json b/ReactJS/alfaprentice/package-lock.json index 4e395ef..7c94a9e 100644 --- a/ReactJS/alfaprentice/package-lock.json +++ b/ReactJS/alfaprentice/package-lock.json @@ -2218,6 +2218,11 @@ "@babel/types": "^7.3.0" } }, + "@types/cookie": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz", + "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow==" + }, "@types/eslint": { "version": "7.2.5", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.5.tgz", @@ -2249,6 +2254,15 @@ "@types/node": "*" } }, + "@types/hoist-non-react-statics": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz", + "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==", + "requires": { + "@types/react": "*", + "hoist-non-react-statics": "^3.3.0" + } + }, "@types/html-minifier-terser": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz", @@ -2319,11 +2333,25 @@ "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.1.5.tgz", "integrity": "sha512-UEyp8LwZ4Dg30kVU2Q3amHHyTn1jEdhCIE59ANed76GaT1Vp76DD3ZWSAxgCrw6wJ0TqeoBpqmfUHiUDPs//HQ==" }, + "@types/prop-types": { + "version": "15.7.3", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", + "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==" + }, "@types/q": { "version": "1.5.4", "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz", "integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug==" }, + "@types/react": { + "version": "16.9.56", + "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.56.tgz", + "integrity": "sha512-gIkl4J44G/qxbuC6r2Xh+D3CGZpJ+NdWTItAPmZbR5mUS+JQ8Zvzpl0ea5qT/ZT3ZNTUcDKUVqV3xBE8wv/DyQ==", + "requires": { + "@types/prop-types": "*", + "csstype": "^3.0.2" + } + }, "@types/resolve": { "version": "0.0.8", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz", @@ -4709,6 +4737,11 @@ } } }, + "csstype": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.5.tgz", + "integrity": "sha512-uVDi8LpBUKQj6sdxNaTetL6FpeCqTjOvAQuQUa/qAqq8oOd4ivkbhgnqayl0dnPal8Tb/yB1tF+gOvCBiicaiQ==" + }, "cyclist": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", @@ -12291,6 +12324,16 @@ "whatwg-fetch": "^3.4.1" } }, + "react-cookie": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-4.0.3.tgz", + "integrity": "sha512-cmi6IpdVgTSvjqssqIEvo779Gfqc4uPGHRrKMEdHcqkmGtPmxolGfsyKj95bhdLEKqMdbX8MLBCwezlnhkHK0g==", + "requires": { + "@types/hoist-non-react-statics": "^3.0.1", + "hoist-non-react-statics": "^3.0.0", + "universal-cookie": "^4.0.0" + } + }, "react-dev-utils": { "version": "11.0.0", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.0.tgz", @@ -14934,6 +14977,15 @@ "crypto-random-string": "^1.0.0" } }, + "universal-cookie": { + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz", + "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==", + "requires": { + "@types/cookie": "^0.3.3", + "cookie": "^0.4.0" + } + }, "universalify": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/universalify/-/universalify-1.0.0.tgz", diff --git a/ReactJS/alfaprentice/package.json b/ReactJS/alfaprentice/package.json index 670eb3c..a37fdab 100644 --- a/ReactJS/alfaprentice/package.json +++ b/ReactJS/alfaprentice/package.json @@ -7,6 +7,7 @@ "@testing-library/react": "^11.2.1", "@testing-library/user-event": "^12.2.2", "react": "^17.0.1", + "react-cookie": "^4.0.3", "react-dom": "^17.0.1", "react-router-dom": "^5.2.0", "react-scripts": "4.0.0", diff --git a/ReactJS/alfaprentice/public/favicon.ico b/ReactJS/alfaprentice/public/favicon.ico deleted file mode 100644 index a11777c..0000000 Binary files a/ReactJS/alfaprentice/public/favicon.ico and /dev/null differ diff --git a/ReactJS/alfaprentice/public/images/logo-licht.png b/ReactJS/alfaprentice/public/images/logo-licht.png new file mode 100644 index 0000000..a56f5ff Binary files /dev/null and b/ReactJS/alfaprentice/public/images/logo-licht.png differ diff --git a/ReactJS/alfaprentice/public/images/logo.png b/ReactJS/alfaprentice/public/images/logo.png new file mode 100644 index 0000000..6e9bab8 Binary files /dev/null and b/ReactJS/alfaprentice/public/images/logo.png differ diff --git a/ReactJS/alfaprentice/public/index.html b/ReactJS/alfaprentice/public/index.html index aa069f2..c2a5c2f 100644 --- a/ReactJS/alfaprentice/public/index.html +++ b/ReactJS/alfaprentice/public/index.html @@ -2,42 +2,14 @@ - - - - - - - - - React App + + + AlfaPrentice
- diff --git a/ReactJS/alfaprentice/public/logo192.png b/ReactJS/alfaprentice/public/logo192.png deleted file mode 100644 index fc44b0a..0000000 Binary files a/ReactJS/alfaprentice/public/logo192.png and /dev/null differ diff --git a/ReactJS/alfaprentice/public/logo512.png b/ReactJS/alfaprentice/public/logo512.png deleted file mode 100644 index a4e47a6..0000000 Binary files a/ReactJS/alfaprentice/public/logo512.png and /dev/null differ diff --git a/ReactJS/alfaprentice/public/manifest.json b/ReactJS/alfaprentice/public/manifest.json deleted file mode 100644 index 080d6c7..0000000 --- a/ReactJS/alfaprentice/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/ReactJS/alfaprentice/public/robots.txt b/ReactJS/alfaprentice/public/robots.txt deleted file mode 100644 index e9e57dc..0000000 --- a/ReactJS/alfaprentice/public/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/ReactJS/alfaprentice/src/App.css b/ReactJS/alfaprentice/src/App.css deleted file mode 100644 index 74b5e05..0000000 --- a/ReactJS/alfaprentice/src/App.css +++ /dev/null @@ -1,38 +0,0 @@ -.App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} diff --git a/ReactJS/alfaprentice/src/App.js b/ReactJS/alfaprentice/src/App.js deleted file mode 100644 index 3784575..0000000 --- a/ReactJS/alfaprentice/src/App.js +++ /dev/null @@ -1,25 +0,0 @@ -import logo from './logo.svg'; -import './App.css'; - -function App() { - return ( -
-
- logo -

- Edit src/App.js and save to reload. -

- - Learn React - -
-
- ); -} - -export default App; diff --git a/ReactJS/alfaprentice/src/App.test.js b/ReactJS/alfaprentice/src/App.test.js deleted file mode 100644 index 1f03afe..0000000 --- a/ReactJS/alfaprentice/src/App.test.js +++ /dev/null @@ -1,8 +0,0 @@ -import { render, screen } from '@testing-library/react'; -import App from './App'; - -test('renders learn react link', () => { - render(); - const linkElement = screen.getByText(/learn react/i); - expect(linkElement).toBeInTheDocument(); -}); diff --git a/ReactJS/alfaprentice/src/Components/Header/Header.js b/ReactJS/alfaprentice/src/Components/Header/Header.js new file mode 100644 index 0000000..29757d8 --- /dev/null +++ b/ReactJS/alfaprentice/src/Components/Header/Header.js @@ -0,0 +1,22 @@ +//Modules +import React from 'react'; + +//Components +import Logo from '../images/logo.png'; +import LogoLight from '../images/logo-licht.png' + +class Header extends React.Component { + render() { + return ( +
+
+
+ Logo +
+
+
+ ) + } +} + +export default Header; \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/Components/Layouts/DefaultLayout.js b/ReactJS/alfaprentice/src/Components/Layouts/DefaultLayout.js new file mode 100644 index 0000000..09d1639 --- /dev/null +++ b/ReactJS/alfaprentice/src/Components/Layouts/DefaultLayout.js @@ -0,0 +1,15 @@ +//Modules +import react from 'react'; + +//Components +import { Header } from '../index'; + +const DefaultLayout = () => { + return( +
+
+
+ ) +} + +export default DefaultLayout; \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/Components/Routing/Router.js b/ReactJS/alfaprentice/src/Components/Routing/Router.js new file mode 100644 index 0000000..cda0b18 --- /dev/null +++ b/ReactJS/alfaprentice/src/Components/Routing/Router.js @@ -0,0 +1,39 @@ +//Modules +import React from "react"; +import { + BrowserRouter as Router, + Switch, + Route, + Link +} from "react-router-dom"; + +//Main routes +import {HomePage} from '../'; + +//Sub routes + +class GlobalRouter extends React.Component { + constructor(props) { + super(props) + this.state = { + errorlog: [], + clear: 'clear' + + } + } + + + render() { + + return ( + + + + + + ); + } + + } + + export default GlobalRouter; \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/Components/images/logo-licht.png b/ReactJS/alfaprentice/src/Components/images/logo-licht.png new file mode 100644 index 0000000..a56f5ff Binary files /dev/null and b/ReactJS/alfaprentice/src/Components/images/logo-licht.png differ diff --git a/ReactJS/alfaprentice/src/Components/images/logo.png b/ReactJS/alfaprentice/src/Components/images/logo.png new file mode 100644 index 0000000..6e9bab8 Binary files /dev/null and b/ReactJS/alfaprentice/src/Components/images/logo.png differ diff --git a/ReactJS/alfaprentice/src/Components/index.js b/ReactJS/alfaprentice/src/Components/index.js new file mode 100644 index 0000000..37918fb --- /dev/null +++ b/ReactJS/alfaprentice/src/Components/index.js @@ -0,0 +1,28 @@ +//Components imports +import GlobalRouter from "./Routing/Router"; +import Header from "./Header/Header"; + +//Layout imports +import DefaultLayout from "./Layouts/DefaultLayout"; + +//Pages imports +import HomePage from '../Pages/HomePage'; + + +//Components exports +export { + GlobalRouter, + Header, +} + + +//Layout exports +export { + DefaultLayout, +} + + +//Pages export +export { + HomePage, +} \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/Pages/HomePage.js b/ReactJS/alfaprentice/src/Pages/HomePage.js new file mode 100644 index 0000000..f6bbe62 --- /dev/null +++ b/ReactJS/alfaprentice/src/Pages/HomePage.js @@ -0,0 +1,12 @@ +//Modules +import React from 'react'; + +class HomePage extends React.Component { + render() { + return( +
dit is de homepage
+ ) + } +} + +export default HomePage; \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/index.css b/ReactJS/alfaprentice/src/index.css deleted file mode 100644 index ec2585e..0000000 --- a/ReactJS/alfaprentice/src/index.css +++ /dev/null @@ -1,13 +0,0 @@ -body { - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', - sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', - monospace; -} diff --git a/ReactJS/alfaprentice/src/index.js b/ReactJS/alfaprentice/src/index.js index ef2edf8..31ae0da 100644 --- a/ReactJS/alfaprentice/src/index.js +++ b/ReactJS/alfaprentice/src/index.js @@ -1,17 +1,14 @@ +//Modules import React from 'react'; import ReactDOM from 'react-dom'; -import './index.css'; -import App from './App'; -import reportWebVitals from './reportWebVitals'; -ReactDOM.render( - - - , - document.getElementById('root') -); +//Components +import {GlobalRouter} from './Components' -// 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(); +const AlfaPrentice = () => { + return( + + ) +} + +ReactDOM.render(, document.querySelector('#root')); \ No newline at end of file diff --git a/ReactJS/alfaprentice/src/logo.svg b/ReactJS/alfaprentice/src/logo.svg deleted file mode 100644 index 6b60c10..0000000 --- a/ReactJS/alfaprentice/src/logo.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/ReactJS/alfaprentice/src/reportWebVitals.js b/ReactJS/alfaprentice/src/reportWebVitals.js deleted file mode 100644 index 5253d3a..0000000 --- a/ReactJS/alfaprentice/src/reportWebVitals.js +++ /dev/null @@ -1,13 +0,0 @@ -const reportWebVitals = onPerfEntry => { - if (onPerfEntry && onPerfEntry instanceof Function) { - import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { - getCLS(onPerfEntry); - getFID(onPerfEntry); - getFCP(onPerfEntry); - getLCP(onPerfEntry); - getTTFB(onPerfEntry); - }); - } -}; - -export default reportWebVitals; diff --git a/ReactJS/alfaprentice/src/setupTests.js b/ReactJS/alfaprentice/src/setupTests.js deleted file mode 100644 index 8f2609b..0000000 --- a/ReactJS/alfaprentice/src/setupTests.js +++ /dev/null @@ -1,5 +0,0 @@ -// jest-dom adds custom jest matchers for asserting on DOM nodes. -// allows you to do things like: -// expect(element).toHaveTextContent(/react/i) -// learn more: https://github.com/testing-library/jest-dom -import '@testing-library/jest-dom';