CourseBits is WiCS's take on a course planning tool for UIC students — primarily focused on Computer Science majors, but helpful for anyone navigating UIC's curriculum. Designed to make course planning intuitive, informative, and tailored to student needs.
This app provides a structured, interactive way to explore and visualize course options, including:
- Course headers
- Course tiles
- Detailed course descriptions
- Extra metadata like prerequisites or credits
Built using JSX, with layout and styling handled through CSS, HTML, and supporting JSON data for course info.
This project uses React with Vite for a fast and modern development experience, including hot module replacement (HMR) and ESLint integration.
Currently, two official Vite plugins are available:
- @vitejs/plugin-react – uses Babel for Fast Refresh
- @vitejs/plugin-react-swc – uses SWC for Fast Refresh
This setup gives you a clean development workflow and speedy builds.
- React / JSX — for building reusable UI components
- Vite — fast bundler and dev server
- CSS — for styling
- HTML — page structure
- JSON — storing and loading course data
Clone the repo and install dependencies:
git clone https://github.com/yourusername/coursebits.git
cd coursebits
npm install
npm run devMake sure you have Node.js and npm installed.
Once the app is running:
- Browse through course tiles
- Click to view descriptions and details
- Use filters (if applicable) to plan out your schedule
Header: Navigation and brandingCourseTile: Preview of individual coursesCourseDescription: Quick overview of each courseCourseDetails: Full breakdown including prerequisites, credits, etc.
- Clean, student-focused UI
- Modular React components
- Built with modern tooling (Vite + React)
- Easy to update with new course info via JSON
- Focused on UIC's CS major path