DOCSEARCHbyAlgolia
Submit Docs

gooodh Blog and Knowledge Base

website·Indexed 31 days ago

https://blog.gooodh.com

A technical blog and documentation site covering Java development with Spring Boot, Vue 3 and React frontend setup, Linux server administration on Ubuntu, and security implementations like OAuth2 and Nginx SSL configuration.

Tokens
35.5K
Snippets
198
Records
212
Agent score
48%

What's inside gooodh

  1. Design a Spring Boot multi-module project structure

    For enterprise-level development, a multi-module structure helps decouple responsibilities. A typical design consists of a parent project and specialized child modules:

    • common: General utilities and shared entities.
    • service: Business logic and database operations.
    • web: Controllers and API endpoints that expose services to the user.
    springboot-multimodule/
├── pom.xml                   （Parent Project）
├── common/                   （Common Module）
│   └── pom.xml
├── service/                  （Service Module）
│   └── pom.xml
└── web/                      （Web Module）
    └── pom.xml

  2. Design a Spring Boot multi-module project structure

    A standard enterprise-level Spring Boot multi-module structure separates concerns into distinct layers to ensure decoupling. A typical design consists of:

    • Parent Project: Manages shared configurations, versions, and module definitions.
    • Common Module: Contains shared utilities, constants, and common entities.
    • Service Module: Contains business logic and service implementations. It depends on the Common module.
    • Web Module: Contains the REST controllers and API endpoints. It depends on the Service module and serves as the application entry point.
    springboot-multimodule/
├── pom.xml                   （Parent Project）
├── common/                   （Common Module: Utils, Entities）
│   └── pom.xml
├── service/                  （Service Module: Business Logic）
│   └── pom.xml
├── web/                      （Web Module: Controllers, API）
│   └── pom.xml

  3. Understand OAuth2 Roles and Responsibilities

    OAuth2 defines five primary roles to manage third-party authorization:

    • Resource Owner: The end-user who owns the data and grants access to the client.
    • Client: The application (web, mobile, or server-side) requesting access to the user's resources. It uses a Client ID and Client Secret for authentication.
    • User Agent: Typically the web browser used by the Resource Owner to interact with the Client and Authorization Server.
    • Authorization Server: The server that authenticates the Resource Owner and issues Access Tokens to the Client.
    • Resource Server: The server hosting the protected user data; it validates the Access Token before granting access.

  4. Initialize project directory structure

    To clean up the default Vite template and prepare for a scalable architecture, perform the following steps:

    1. Delete all default .vue files in the views folder.
    2. Delete all default .vue files in the components folder.
    3. Create new directories for api and stores.

  5. Configure Spring Boot sub-module dependencies

    Sub-modules should reference the parent project and declare dependencies based on their role in the architecture. The web module requires the spring-boot-maven-plugin to build the executable JAR.
    <!-- Common Module -->
<artifactId>common</artifactId>
<dependencies>
    <dependency>
        <groupId>org.projectlombok</groupId>
        <artifactId>lombok</artifactId>
        <optional>true</optional>
    </dependency>
</dependencies>

<!-- Service Module -->
<artifactId>service</artifactId>
<dependencies>
    <dependency>
        <groupId>com.example</groupId>
        <artifactId>common</artifactId>
        <version>1.0-SNAPSHOT</version>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter</artifactId>
    </dependency>
</dependencies>

<!-- Web Module -->
<artifactId>web</artifactId>
<dependencies>
    <dependency>
        <groupId>com.example</groupId>
        <artifactId>service</artifactId>
        <version>1.0-SNAPSHOT</version>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
</dependencies>
<build>
    <plugins>
        <plugin>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-maven-plugin</artifactId>
        </plugin>
    </plugins>
</build>

  6. Understand OAuth2 roles and responsibilities

    OAuth2 defines five primary roles to manage delegated access to protected resources:

    • Resource Owner: The end-user who owns the data and grants access to it.
    • Client: The application (web, mobile, or server-side) requesting access to the user's resources. It uses a Client ID and Client Secret for authentication.
    • User Agent: Typically the web browser used by the Resource Owner to interact with the Client and Authorization Server.
    • Authorization Server: The server that authenticates the Resource Owner and issues Access Tokens to the Client.
    • Resource Server: The server hosting the protected user data, which validates Access Tokens before granting access.

  7. Obtain an SSL certificate using Certbot for Nginx

    Use the Certbot Nginx plugin to automatically detect the Nginx configuration and request a certificate for a specific domain. Replace example.com with your actual domain name.
    sudo certbot --nginx -d example.com

  8. Implement a custom 404 Not Found page

    To handle undefined routes, add a catch-all route using path="*" at the end of your route definitions. This will render the specified component whenever the URL does not match any other defined routes.
    // In your router configuration
<Route path="*" element={<NotFoundPage/>} />

  9. Install Pinia and Persistence Plugin

    Install Pinia for state management and pinia-plugin-persistedstate to persist store state across page reloads.
    npm install pinia
npm i pinia-plugin-persistedstate

  11. Install and configure Tailwind CSS in Vite

    Install Tailwind CSS and its peer dependencies, initialize the configuration, and add the Tailwind directives to your CSS entry point.
    npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

    // tailwind.config.js /** @type {import('tailwindcss').Config} / export default { content: [ "./index.html", "./src/**/.{js,ts,jsx,tsx", ], theme: { extend: {} }, plugins: [], }

    // index.css @tailwind base; @tailwind components; @tailwind utilities;

  12. Install Chinese font support for Puppeteer on Ubuntu

    To ensure Chromium (used by Puppeteer) correctly renders Chinese characters on Ubuntu or other Linux systems, install the Microsoft Core Fonts and Noto CJK fonts.
    sudo apt-get update
sudo apt-get install -y ttf-mscorefonts-installer fonts-noto-cjk