This repository is the frontend code for the SHPE UF website. SHPE, also known as the Society of Hispanic Professional Engineers, is a Hispanic community at the University of Florida that strives to reach its fullest potential by impacting the world through STEM awareness, access, support and development. The goal of this website is to allow our community easy access to several professional, academic and communal resoures.
Using the https link under "Code", downloads the repository's code onto your personal computer.
Installs the node_modules folder needed to run the client.
Runs our client. In development, we use localhost:3000 as our client host and in production we use the hosting service Netlify to run our client SHPE UF.
We run our server code separately as seen here on
Heroku. Instructions to run the server are explained in that repository.
In Apolloprovider.js, you can change the httplink to specify if you'd like to recieve information
from Heroku.
Build scripts are not included in this readme beacause the build is deployed on Netlify, which runs these for us.
The majority of our code is set up within the src folder. Inside, we have react components, public
and private pages, Apollo Provider, App.js and more. Each is explained further below.
The components folder houses react components that are used within each web page. Each piece of every page that serves user interaction is separated into its own component. Multiple components are often used within each page. This separation of components allows for better modality and reability within our files.
The pages folder includes our public and private pages. The public folder contains pages that users can interact with without needing to sign in. The files outside of the public folder are our private pages. These include our admin accessible pages and our general signed in user pages. Users need to create an account and sign in to access the majority of our internal resoures.
Apollo Provider is a file within src that connects our backend uri to our frontent using the
Apollo Client. The file exports the Apollo Provider
component with our client and the App.js.
The App.js file defines all of our pages and creates a routing mechanism to each. Routes are defined depending on accessibility.
The Assets folder holds fonts and images that are used across the website.
Outside of src, package.json and package-lock.json are used to retain the open sourced
dependencies our project utilizes and the version to download when running npm install.