sfc-aqua.github.io

This is the source repository for the SFC AQUA homepage, accessible at https://aqua.sfc.wide.ad.jp/ with a redirect at https://sfc-aqua.github.io.

Making additions and updates

First, follow the instructions in "Development," below, to set up your development environment.

Adding or updating your member information

Everyone in AQUA should have a profile on the Members page.

The profiles are generated from information in the file src/app/members/members-data.ts. Edit this file to add or change your profile information.

Pictures should be added to the directory public/images/members. Your picture should be in JPEG or WebP format with a 1:1 aspect ratio, maximum dimensions 500x500px, and maximum file size of 500kb. Do not use PNG for photographic or photo-like images; PNG is appropriate for rasterized vector graphics. You can upload a square picture; it will be automatically rounded for display.

If you are unsure about what photo editing application to use, try the GNU Image Manipulation Program, a free, open-source alternative to Photoshop.

Adding or updating publications

Your publications should be added to the appropriate file in src/app/publications. Files in this directory use the MDX format, which is based on the Markdown markup language. If you are familiar with Markdown, you can most likely write MDX without any issues.

Development

This is a Next.js project bootstrapped with create-next-app.

Prerequisites

In principle, everyone modifying this repository should be a member of the sfc-aqua GitHub organization. If you are not a member, ask one of the organization owners to add you before continuing.

You must be familiar with Git usage; see the Moonshot project Git workflow documentation for basics.

Using Visual Studio Code (VSCode)

These instructions will work on Windows, MacOS, or Linux.

Install the following:

• VSCode
• Docker
• VSCode Dev Container Extension

Using VSCode, Git clone this repository.

Then, open the Dev Container: Open the command palette from View > Command Palette and then type and select Dev Containers: Rebuild and Reopen in Container.

Without VSCode

On MacOS, Linux, or other Unix-like systems, simply install NodeJS on your system, git clone this repository, and continue.

Getting Started

Before making any changes, be sure to create a Git branch for your work.

Then, to execute the development server, run the following from the repository's base directory (inside your VSCode Dev Container, if using VSCode):

$ npm install
$ npm run dev

Open http://localhost:3000.

Before committing or pushing your changes, run npm run lint to format your code. Improperly formatted code will be rejected.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.
• Next.js GitHub repository