Skip to content

Latest commit

 

History

History
136 lines (88 loc) · 3.96 KB

README.md

File metadata and controls

136 lines (88 loc) · 3.96 KB
Raw

Web

NTU SCSE's main public facing website, built with Next.js.

Tables of Content

  1. Requirements
  2. Getting Started
  3. Storybook
  4. How to Contribute
  5. Tests

Requirements


Getting Started

Secrets

First copy the contents of .env.example file to a new file named .env.local in the same directory.
Populate the variables in this file - ask your team lead or the IT Executive for these variables.

Installation

At the root directory of web, download all the required node packages:

yarn

Local Development

  1. Run the local development server:
yarn dev
  1. Open http://localhost:3001 with your browser to see the result.

Learn how to contribute to this project here.


Storybook

Introduction:

Storybook is a frontend workshop for building UI components and pages in isolation. It can be used for UI development, testing, and documentation.

The basics of Storybook can be learned from https://storybook.js.org/docs/react/writing-stories/introduction

When to use Storybook?

Stories are usually written for testing components in isolation from the main web page.

Thus, you should write stories when developing a component in the packages/ui/components directory.

Starting Storybook:

Navigate to the website/packages/ui directory, and run:

yarn storybook

How To Contribute

Steps:

  1. In the main branch, run git pull to get the latest changes.
  2. Create a new branch by running git checkout -b web/[task-type]/SCSE-[task_number]. Work on your task/feature in this branch.
  3. After you are done with all your changes, git add . and git commit -m "commit message" to commit your changes locally.
  4. Next, run git pull origin main --rebase to fetch new changes in the main branch (if any). Fix merge conflicts if any.
  5. Push your branch to GitHub by running git push or git push --set-upstream origin [branch-name] (if this branch does not exist on GitHub)
  6. Go to this GitHub repo and make a pull request from your branch to main branch. Name the PR starting with [SCSE-branch_number] (e.g.: [SCSE-125] Add web docs).
  7. Ensure that all automated checks passes. Fix any errors that occurs.
  8. Request 1 person to review your pull request, and you are done!

Naming Conventions:

Naming [task-type] for new branches
  • feat: A new feature
  • fix: A bug fix
  • docs: Documentation only changes
  • style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc.)
  • refactor: A code change that neither fixes a bug nor adds a feature
  • perf: A code change that improves performance
  • test: Adding missing or correcting existing tests
  • chore: Changes to the build process or auxiliary tools and libraries such as documnetation generation
  • revert: A revert to a previous commit

Tests

1. Jest Unit Tests

All Jest unit tests are written in the _tests_ directory with test.tsx and snapshot.tsx extension.

To run jest unit tests, run:

yarn test

Note: Snapshots need to be updated after changes have been made to the pages. This can be achieved by running:

yarn test -u

2. Cypress E2E Tests

All Cypress tests are written in the cypress/e2e directory with the extension .cy.ts.

To begin cypress e2e test, run the following command to open the UI:

yarn cypress