The current repository holds the entire codebase of frontend of SWD Portal of BITS Pilani,Hyderabad Campus
After cloning/downloading you'll find the following directories and files:
.
├── jsconfig.json
├── package.json
├── public
│ ├── favicon.ico
│ ├── index.html
│ └── manifest.json
├── README.md
├── src
│ ├── App.js
│ ├── assets
│ │ ├── css
│ │ ├── img
│ │ ├── jss
│ │ └── scss
│ ├── components
│ │ ├── Badge
│ │ ├── Card
│ │ ├── Clearfix
│ │ ├── CustomButtons
│ │ ├── CustomDropdown
│ │ ├── CustomInput
│ │ ├── CustomLinearProgress
│ │ ├── CustomTabs
│ │ ├── Footer
│ │ ├── Grid
│ │ ├── Header
│ │ ├── InfoArea
│ │ ├── Navbars
│ │ ├── NavPills
│ │ ├── Pagination
│ │ ├── Parallax
│ │ ├── Sidebar
│ │ ├── Snackbar
│ │ ├── Table
│ │ ├── Tasks
│ │ └── Typography
│ ├── context
│ │ └── auth.js
│ ├── index.js
│ ├── layouts
│ │ ├── Admin.js
│ │ ├── Official.js
│ │ └── RTL.js
│ ├── logo.svg
│ ├── OfficialPrivateRoute.js
│ ├── OfficialRoutes.js
│ ├── routes.js
│ ├── StudentPrivateRoute.js
│ ├── variables
│ │ ├── BaseUrl.js
│ │ ├── general.js
│ │ └── swdmembers.js
│ └── views
│ ├── Awards
│ ├── Connect
│ ├── Counsellor
│ ├── Dashboard
│ ├── Deductions
│ ├── Documents
│ ├── Faqs
│ ├── Goodies
│ ├── KnowYourDept
│ ├── KYA
│ ├── LandingPage
│ ├── LoginPage
│ ├── MedClaim
│ ├── Modals
│ ├── Official
│ ├── OfficialComponents
│ ├── Outstation
│ ├── ResetPassword
│ ├── Scholarship
│ ├── UserProfile
│ └── VirtualCampus
└── yarn.lock
The website can be specifically divided into two parts
- Student side (Student Portal)
- Official side (Official Portal)
The student side uses the admin.js layout and all the components associated with student side can be found at /src/views/.
The student side uses the official.js layout and all the components associated with student side can be found specifically at /src/views/official .
- This project uses Material-ui React components. The components are customized to specific needs using @material-ui/styles. All the customized components are available at
/src/components. All the customized styled CSS are availabel at/assets/jss/ - Styles specific to Landing page , Official login page and student login page can be found at
assets/jss/material-kit-react. - Styles for other pages can be found at
assets/jss/material-kit-react
- Fork the repository to your own account.
- Clone the forked repo on your own computer and make any changes.
- Push all changes to remote origin
- Create a pull request.
- Resolve conflicts if any
- In order to maintain a standard level of coding style we'll be using standard js package.
- Install Standard JS globally using :
npm install standard --global
- Before creating any pull requests always run the command :
npx standard --fix
and fix any errors.
- Know more about StandardJS here.
- Install NodeJS on your system
- Enter into the project folder and run the command to install dependencies :
npm install
- To start the react app run the following commmand :
npm start
This will by default start the react project at port 3000. Ignore the warnings (if any);
- When installing a new dependancy always use :
npm install --save package_name
Always use the --save flag to install any package
- Always uninstall packages that are no longer in use using the command :
npm uninstall --save package_name
-
Get your self really familiar with Reactjs to start contributing to this repo.
-
Keep in mind the specific styling for the component and don't disturb the global styling space in
/assets/jss/material-kit-reactor/assets/jss/material-dashboard-react. Create specific style objects for your components in in that folder and use it upto eternity. -
For state management no specific package is used like redux or zustand. Basic React hooks have been utilised for the purpose.
-
Beginner Friendly pages to contribute include
- Landing page
- FAQ
- Know Your Academics
- And content related pages to get familiar with react
