ArcMichael / vm-operation-portal

vm operation portal

This is a template to learn how to use next and next-auth to create a portal

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

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

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.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Adjustments to Docker Compose Configuration

For Single Sign-On (SSO), we need to utilize Keycloak. Currently, it points to sso.mly0110.org.cn. Given the requirement for public DNS, the Docker Compose configuration should:

• Modify the DNS to point towards the router, rather than BIND9.

Additionally, since pnpm install requires access to Nexus:

• The Docker Compose configuration should update the hosts to direct registry to the internal Nexus address.

Code Conventions: Naming Rules

To ensure clarity and consistency across the codebase, it's essential to follow strict naming conventions. Here are some basic guidelines:

• Files: Use kebab-case (e.g., header-smc-collapsible.tsx, content-brandcrumb.tsx).
• Variables: Use camelCase (e.g., userName, userProfile).
• Constants: Use UPPER_SNAKE_CASE (e.g., MAX_LIMIT, API_ENDPOINT).
• Functions/Methods: Use camelCase, starting with a verb (e.g., getUserData(), setUserProfile()).
• Classes/Interfaces: Use PascalCase (e.g., UserProfile, UserSettingsInterface).

By adhering to these naming conventions, the code remains readable and easier for team collaboration.