Code Monkey home page Code Monkey logo

campus-web's Introduction

campUS(Web Version)


A University based community building app/website that enables students on campus to help each other and gain points, resulting in them being more recognized. Students can post their requests, and other people on campus can view their requests and attend to their requests, enabling students on campus to assist each other at times of need, while ensuring that they form valuable connections and networks in the process.


Project Structure

Here's an overview of the project structure:

  • public: Contains static assets like HTML files and images.
  • src: The main source code directory.
    • assets: Store your project's assets such as images, fonts, and styles.
    • components: React components used throughout the project.
    • pages: Individual page components or route components.
    • firebase: Firebase configuration and related files.
    • App.jsx: The main application component.
    • index.js: Entry point for the application.
  • .env: Environment variables for development.
  • vite.config.js: Vite configuration file.
  • package.json: Project dependencies and scripts.

Tech stack used:

The tech stack used here is:

  • React JS
  • Tailwind CSS
  • Google Firebase
  • Vite

Before contributing look into CONTRIBUTING GUIDELINES

Our Code of Conduct: CODE OF CONDUCT


Project setup instructions:

  • Fork the repository to your GitHub account by clicking the "Fork" button at the top-right corner of this page. This will create a copy of the repository under your account.

  • Clone your forked repository to your local machine using Git. Replace your-username with your GitHub username:

    git clone https://github.com/your-username/campUS-Web.git
    cd campUS-Web
    
  • Install project dependencies using npm (Node Package Manager):

    npm install
    
  • Create a new branch for your contribution. Replace 'feature/your-feature-name' with a descriptive branch name related to your contribution:

Replace Firebase Configuration

To use your own Firebase project with campUS-Web, follow these steps to replace the Firebase configuration:

  1. Create a Firebase Project:

    • Go to the Firebase Console.
    • Click on "Add project" and follow the on-screen instructions to create your project.
    • Once your project is created, navigate to the project settings.
  2. Generate Firebase Configuration:

    • In the Firebase project settings, scroll down to the "Your apps" section.

    • Click on the "Web" app icon (</>) to add a web app to your project.

    • Register your app by giving it a nickname and enabling Firebase Hosting if needed.

    • After registering your app, you'll be provided with a Firebase configuration object that looks like this:

      const firebaseConfig = {
        apiKey: "YOUR_API_KEY",
        authDomain: "YOUR_AUTH_DOMAIN",
        projectId: "YOUR_PROJECT_ID",
        storageBucket: "YOUR_STORAGE_BUCKET",
        messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
        appId: "YOUR_APP_ID"
      };
  3. Replace Firebase Configuration:

    • Open the src/firebase/firebase.js file in your campUS-Web project.
    • Replace the existing Firebase configuration with the configuration you obtained from Firebase Console.

    Example:

    // src/firebase/firebase.js
    
    import { initializeApp } from "firebase/app";
    
    const firebaseConfig = {
      apiKey: "YOUR_API_KEY",
      authDomain: "YOUR_AUTH_DOMAIN",
      projectId: "YOUR_PROJECT_ID",
      storageBucket: "YOUR_STORAGE_BUCKET",
      messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
      appId: "YOUR_APP_ID"
    };
    
    const app = initializeApp(firebaseConfig);
    
    export default app;
    

Development

  • Make your changes or additions to the codebase. Test your changes to ensure they work as expected. To run the website on your localhost:

    npm run dev
    
  • Commit your changes with a descriptive commit message:

    git commit -m "Add your descriptive message here"
    

Push Changes

  • Push your changes to your forked repository on GitHub:
    git push origin feature/your-feature-name
    

Getting started with contributions

  • Create a Pull Request (PR)

Visit the campUS-Web repository on GitHub. Click the "Compare & pull request" button next to your recently pushed branch. Follow the PR template and guidelines. Provide details about your changes. Submit the PR.

  • Review and Merge

The maintainers will review your PR and may request changes or provide feedback. Once your PR is approved, it will be merged into the main repository.


Final version of the project

Click here for the UI design and prototype of the project.


Intended final project:

A responsive and aesthetically designed university-community building website called campUS(Web version).


Thank You

Thank you for contributing to campUS-Web! Your contributions help make this project better for everyone. If you have any questions or need further assistance, please don't hesitate to reach out to us.


Contributors


Maintainers

  1. Syed Hisham Akmal
  2. Sanjay M

campus-web's People

Contributors

sikehish avatar griseduardo avatar sanjay14073 avatar samara6855 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.