Event Feed

A platform for Ohio State students to keep up with the various happenings around campus.

🛠️ Getting Started

Note

This project uses...

• Git as version manager.
• GitHub for code hosting and collaboration.
• node 22 as dev server runtime.
• npm as package manager.
• vite as website bundler.
• (Later vitest as testing framework.)
• biome as formatter/linter.
• husky for git hooks and automation.

Step 1. Set Up Node.js 22

https://nodejs.org/en/download/package-manager

Download and install Node.js version 22 from official website, choosing via the node version manager (nvm) option. Example screenshot for Linux users:

To verify successful node 22 setup, check the currently installed version in your terminal:

node --version

Step 2. Set Up Git

https://git-scm.com/downloads

To verify successful git setup, check the currently installed version in your terminal:

git --version

You are now ready to clone the repository, using your terminal:

git clone https://github.com/devosu/event-feed.git

Make sure to switch to the cloned repository directory (cd) in your terminal to move on to the next step:

cd event-feed

Step 3. Set Up Collaboration

Using git, in your terminal:

1. list all the remote branches,
2. find the feature branch you are responsible for,
3. create your local copy of the branch,
4. make sure your branch is up to date with main.

# Update your local main branch.
git switch main
git pull origin main

# Fetch all remote branch info. 
git fetch origin

# List all available branches.
git branch -a

# Switch to and create a local copy of the remote feature branch.
git switch --track origin/Feature/YourFeature

# Make sure your local branch is up-to-date with main.
git merge main

Note

Remember to create a Pull Request and request code review when merging to main.

Step 4. Set Up Firebase

Install the dependencies using npm in your terminal:

npm install

Then start the development server for the first time in your terminal:

npm run dev

Your terminal should output something like this:

$ npm run dev

> [email protected] dev
> vite

Re-optimizing dependencies because lockfile has changed

  VITE v5.4.6  ready in 651 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

If you copy and paste the localhost url into your browser, you might find that you are seeting blank screen instead of default project screen.

Example of black screen with Firebase error:

Example of default project screen:

This is because we have not yet set up Firebase, our backend and database framework.

Important

Please let @KemingHe know to add your Gmail to the Firebase project and give you access.

Open Firebase Console in your browser and look for the DEV OSU Event Feed project card:

https://console.firebase.google.com

Once inside, navigate to the Event Feed App to find the Firebase credentials needed for this project to work. Make sure to click on the gear icon to access the app page.

Scroll down on the app page to find the Firebase credentials:

Warning

NEVER hard-code credentials into the project, we will follow best security practice and use a local .env setup instead. Read carefully:

In your terminal, create a copy of the existing .env.example file and name it .env. This new file is local to your device and should NEVER be shared.

cp .env.example .env

Don't copy the quotes ", populate your local .env file with all the necessary credentials:

# This is correct.
VITE_FIREBASE_API_KEY=some-key

# This is INCORRECT!
VITE_FIREBASE_API_KEY = "some-key"

Your .env file should look something like this in the end:

VITE_FIREBASE_API_KEY=some-key
VITE_FIREBASE_AUTH_DOMAIN=some-auth-domain
VITE_FIREBASE_PROJECT_ID=some-project-id
VITE_FIREBASE_STORAGE_BUCKET=some-storage-bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=some-sender-id
VITE_FIREBASE_APP_ID=some-app-id

Now when you run npm run dev, you should see the default project screen. Congrates on setting up Firebase!

Step 5. Contribute

You are now ready to contribute to Event Feed!

🛡️ License

MIT

💖 Community

Contributors

Made with contrib.rocks.

Activities