Skip to content

Commit b316bda

Browse files
Darren52BTDarren52BT
authored
#22: Migrated Frontend to Vite
* finished vite migration and restructured scss * removed redundant css * path corrections * fixed paths
1 parent b3b1e0e commit b316bda

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+2579
-34312
lines changed

‎frontend/public/index.html‎ renamed to ‎frontend/index.html‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,13 @@
99
name="description"
1010
content="Web site created using create-react-app"
1111
/>
12-
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
12+
<link rel="apple-touch-icon" href="/logo192.png" />
1313
<!--
1414
manifest.json provides metadata used when your web app is installed on a
1515
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
1616
-->
17-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18-
<!--
19-
Notice the use of %PUBLIC_URL% in the tags above.
20-
It will be replaced with the URL of the `public` folder during the build.
21-
Only files inside the `public` folder can be referenced from the HTML.
17+
<link rel="manifest" href="/manifest.json" />
2218

23-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24-
work correctly both with client-side routing and a non-root public URL.
25-
Learn how to configure a non-root public URL by running `npm run build`.
26-
-->
2719
<link rel="preconnect" href="https://fonts.googleapis.com" />
2820
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
2921
<link
@@ -35,6 +27,7 @@
3527
<body>
3628
<noscript>You need to enable JavaScript to run this app.</noscript>
3729
<div id="root"></div>
30+
<script type="module" src="/src/index.jsx"></script>
3831
<!--
3932
This HTML file is a template.
4033
If you open it directly in the browser, you will see an empty page.

‎frontend/package-lock.json‎

Lines changed: 2480 additions & 16968 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,12 @@
1212
"react-bootstrap-icons": "^1.10.3",
1313
"react-dom": "^18.2.0",
1414
"react-router-dom": "^6.18.0",
15-
"react-scripts": "5.0.1",
1615
"web-vitals": "^2.1.4"
1716
},
1817
"scripts": {
19-
"start": "set PORT=3001 && react-scripts start",
20-
"build": "react-scripts build",
21-
"test": "react-scripts test",
22-
"eject": "react-scripts eject"
18+
"start": "vite",
19+
"build": "vite build",
20+
"serve": "vite preview"
2321
},
2422
"eslintConfig": {
2523
"extends": [
@@ -40,6 +38,9 @@
4038
]
4139
},
4240
"devDependencies": {
43-
"@babel/plugin-proposal-private-property-in-object": "^7.21.11"
44-
}
41+
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
42+
"@vitejs/plugin-react": "^4.2.1",
43+
"vite": "^5.0.11"
44+
},
45+
"type":"module"
4546
}

‎frontend/src/App.js‎ renamed to ‎frontend/src/App.jsx‎

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,17 @@
11
import { Route, Routes } from "react-router-dom";
2-
import Home from "./pages/Home.js";
3-
import ArticleList from "./pages/ArticleList.js";
4-
import ArticleView from "./pages/ArticleView.js";
5-
import Signup from "./pages/Signup.js";
6-
import Signin from "./pages/Signin.js";
7-
import BasePage from "./pages/BasePage.js";
8-
9-
10-
2+
import Home from "./pages/Home.jsx";
3+
import ArticleList from "./pages/ArticleList.jsx";
4+
import ArticleView from "./pages/ArticleView.jsx";
5+
import Signup from "./pages/SignPages/Signup.jsx";
6+
import Signin from "./pages/SignPages/Signin.jsx";
7+
import BasePage from "./pages/BasePage.jsx";
118

129
function App() {
1310
return (
1411
<>
1512
<Routes>
16-
<Route path="/" element={<BasePage/>}>
17-
<Route path="/" element={<Home/>}/>
13+
<Route path="/" element={<BasePage />}>
14+
<Route path="/" element={<Home />} />
1815
<Route path="signin" element={<Signin />} />
1916
<Route path="signup" element={<Signup />} />
2017
<Route path="article_search_results">

‎frontend/src/Components/Article/Article.js‎ renamed to ‎frontend/src/Components/Article/Article.jsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import ImageBanner from "./ImageBanner.js";
2-
import ArticleHeader from "./ArticleHeader/ArticleHeader.js";
3-
import TableOfContents from "./Section/TableOfContents.js";
4-
import RelatedTopicsList from "./Topics/RelatedTopicsList.js";
5-
import BodySection from "./Section/BodySection.js";
1+
import ImageBanner from "./ImageBanner.jsx";
2+
import ArticleHeader from "./ArticleHeader/ArticleHeader.jsx";
3+
import TableOfContents from "./Section/TableOfContents.jsx";
4+
import RelatedTopicsList from "./Topics/RelatedTopicsList.jsx";
5+
import BodySection from "./Section/BodySection.jsx";
66
import { Container, Row, Col, Stack } from "react-bootstrap";
7-
7+
import './ArticleComponents.scss'
8+
import './Article.scss'
89
//dummy data for table of contents
910
const tableOfContents = [
1011
"Introduction to Machine Learning",

‎frontend/src/Components/Article/Article.scss‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
2+
@import "../../../node_modules/bootstrap/scss/bootstrap-grid.scss";
3+
@import "../../../node_modules/bootstrap/scss/grid";
4+
@import "../../../node_modules/bootstrap/scss/variables";
5+
@import "../../../node_modules//bootstrap/scss/mixins";
6+
7+
//Related Topics Container
8+
.rel-topics-container {
9+
@include media-breakpoint-down(md) {
10+
border-top: 1px solid black;
11+
}
12+
13+
@include media-breakpoint-up(md) {
14+
border-left: 1px solid black;
15+
}
16+
}

‎frontend/src/scss/ArticleComponents.scss‎ renamed to ‎frontend/src/Components/Article/ArticleComponents.scss‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import '../../scss/variables';
2+
13
//SectionHeader, ArticleHeaderDesc marker styling
24
.section-header-marker,
35
.article-desc-marker {

‎frontend/src/Components/Article/ArticleHeader/ArticleHeader.js‎ renamed to ‎frontend/src/Components/Article/ArticleHeader/ArticleHeader.jsx‎

File renamed without changes.

‎frontend/src/Components/Article/ArticleHeader/ArticleHeaderAuthorDate.js‎ renamed to ‎frontend/src/Components/Article/ArticleHeader/ArticleHeaderAuthorDate.jsx‎

File renamed without changes.

‎frontend/src/Components/Article/ArticleHeader/ArticleHeaderDesc.js‎ renamed to ‎frontend/src/Components/Article/ArticleHeader/ArticleHeaderDesc.jsx‎

File renamed without changes.

0 commit comments

Comments
 (0)