![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
|
Java Spring Boot |
~/Documents/Java$ unzip springexam.zip
server.port=8080
$ cat META-INF/MANIFEST.MF
Manifest-Version: 1.0
Created-By: Maven JAR Plugin 3.2.2
Build-Jdk-Spec: 17
Implementation-Title: SpringExam
Implementation-Version: 0.0.1-SNAPSHOT
Main-Class: org.springframework.boot.loader.JarLauncher
Start-Class: com.example.springexam.SpringExamApplication
Spring-Boot-Version: 2.6.7
Spring-Boot-Classes: BOOT-INF/classes/
Spring-Boot-Lib: BOOT-INF/lib/
Spring-Boot-Classpath-Index: BOOT-INF/classpath.idx
Spring-Boot-Layers-Index: BOOT-INF/layers.idx
SpringExam ├── src │ ├── main │ │ ├── frontend * │ │ ├── java │ │ └── resources │ │ ├── application.properties │ │ ├── static * │ │ └── templates │ └── test │ └── java └── target
~/SpringExam/src/main$ npx create-react-app frontend --template typescript
動作確認
~/SpringExam/src/main$ cd frontend ~/SpringExam/src/main/frontend$ npx start
好吃
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.7.3</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.example</groupId>
<artifactId>springexam</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>SpringExam</name>
<description>Demo project for Spring Boot and React</description>
<properties>
<java.version>17</java.version>
<lombok.version>1.18.24</lombok.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jdbc</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-tx</artifactId>
<version>5.3.22</version>
</dependency>
<dependency>
<groupId>com.h2database</groupId>
<artifactId>h2</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.postgresql</groupId>
<artifactId>postgresql</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>${lombok.version}</version>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<!--
https://spring.pleiades.io/spring-boot/docs/current/maven-plugin/reference/htmlsingle/
The version tag is not needed because parent (spring-boot-starter-parent) knows its version.
But I wrote the version tag because the IntelliJ warn lacking version.
-->
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<version>${project.parent.version}</version>
<configuration>
<excludes>
<exclude>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<!-- Don't add version tag. If you added version tag. you will see
that following curious error message:
"Cannot find 'version' in class org.springframework.boot.maven.Exclude" -->
</exclude>
</excludes>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.10.1</version>
<goals>
<goal>compile</goal>
</goals>
<configuration>
<annotationProcessorPaths>
<path>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>${lombok.version}</version>
</path>
</annotationProcessorPaths>
</configuration>
</plugin>
<plugin>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>1.12.1</version>
<executions>
<execution>
<id>install node and npm</id>
<goals>
<goal>install-node-and-npm</goal>
</goals>
<phase>prepare-package</phase>
</execution>
<execution>
<id>install node modules</id>
<goals>
<goal>npm</goal>
</goals>
<phase>prepare-package</phase>
<configuration>
<arguments>install</arguments>
</configuration>
</execution>
<execution>
<id>execute npm run build</id>
<goals>
<goal>npm</goal>
</goals>
<phase>prepare-package</phase>
<configuration>
<arguments>run build</arguments>
</configuration>
</execution>
</executions>
<configuration>
<nodeVersion>v16.15.1</nodeVersion>
<npmVersion>8.11.0</npmVersion>
<workingDirectory>src/main/frontend</workingDirectory>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-resources-plugin</artifactId>
<version>3.3.0</version>
<executions>
<execution>
<id>copy-resources</id>
<phase>prepare-package</phase>
<goals>
<goal>copy-resources</goal>
</goals>
<configuration>
<outputDirectory>${basedir}/target/classes/static</outputDirectory>
<resources>
<resource>
<directory>${basedir}/src/main/frontend/build</directory>
<filtering>false</filtering> <!-- true : replace ${...} in the resource.-->
</resource>
</resources>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
<pluginManagement>
<plugins>
<plugin>
<!--
The maven-surefire-plugin depends on spring-boot-starter-test 2.7.3
is too old to support Java17. So, I specify the newest version.
-->
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-surefire-plugin</artifactId>
<version>3.0.0-M7</version>
</plugin>
</plugins>
</pluginManagement>
</build>
</project>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE logback>
<configuration>
<property name="logFileName" value="app" />
<!-- for development (application.properties#spring.profiles.active switch the mode) -->
<springProfile name="development">
<property name="logLevel" value="DEBUG"/>
<property name="logFilePath" value="target/log/" />
</springProfile>
<!-- for production (application.properties#spring.profiles.active switch the mode) -->
<springProfile name="production">
<property name="logLevel" value="INFO"/>
<property name="logFilePath" value="/var/log/" />
</springProfile>
<!-- stdout -->
<appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender">
<target>System.out</target>
<encoder>
<charset>UTF-8</charset>
<pattern>%d{yyyy/MM/dd HH:mm:ss} %-5level [%thread] - %msg%n</pattern>
</encoder>
</appender>
<!-- logfile -->
<appender name="APPLICATION_LOG" class="ch.qos.logback.core.rolling.RollingFileAppender">
<file>${logFilePath}${logFileName}.log</file>
<rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy">
<fileNamePattern>${logFilePath}${logFileName}-%d{yyyy-MM-dd}.log.zip</fileNamePattern>
<maxHistory>3</maxHistory>
</rollingPolicy>
<encoder>
<charset>UTF-8</charset>
<pattern>%d{yyyy/MM/dd HH:mm:ss} %-5level [%thread] - %msg%n</pattern>
</encoder>
</appender>
<!-- log settings for this application -->
<logger name="com.example.springexam" level="${logLevel}">
<appender-ref ref="APPLICATION_LOG" />
</logger>
<!-- log settings for the SpringBoot and this application -->
<root level="INFO">
<appender-ref ref="STDOUT" />
</root>
</configuration>spring.profiles.active=developmentspring.datasource.driver-class-name=org.h2.Driver
spring.datasource.url=jdbc:h2:~/testdb
spring.datasource.username=sa
spring.datasource.password=
# spring.datasource.initialization-mode was deprecated from Spring Boot 2.5.
spring.sql.init.mode=always
spring.sql.init.schema-locations=classpath:schema.sql
spring.sql.init.data-locations=classpath:data.sql
spring.sql.init.encoding=utf-8
spring.h2.console.enabled=trueDROP TABLE piece_tbl;
CREATE TABLE IF NOT EXISTS piece_tbl (
id BIGINT PRIMARY KEY auto_increment,
number INT,
name VARCHAR(255),
color VARCHAR(255),
shape VARCHAR(255)
);INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 1,'bar' ,'yellow','{{1,1,1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 2,'little-L','orange','{{1,0,0,0},{1,1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 3,'little-T','green' ,'{{0,1,0,0},{1,1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 4,'thunder' ,'blue' ,'{{1,1,0,0},{0,1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 5,'big-L' ,'cyan' ,'{{1,0,0},{1,0,0},{1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 6,'snail' ,'purple','{{1,1,0},{1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 7,'wedge' ,'yellow','{{1,0,1},{1,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 8,'Z' ,'cyan' ,'{{1,1,0},{0,1,0},{0,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES ( 9,'dog' ,'orange','{{0,1,0},{1,1,1},{1,0,0}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES (10,'big-T' ,'blue' ,'{{1,1,1},{0,1,0},{0,1,0}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES (11,'stair' ,'green' ,'{{1,0,0},{1,1,0},{0,1,1}}');
INSERT INTO PIECE_TBL(NUMBER,NAME,COLOR,SHAPE) VALUES (12,'cross' ,'purple','{{0,1,0},{1,1,1},{0,1,0}}');
spring.datasource.driver-class-name=org.postgresql.Driver
spring.datasource.url=jdbc:postgresql://pgsql:5432/kataminoDb
# Refer system environments of
# Docker Container/Kubernetes Pod/Bare-metal Process.
spring.datasource.username=${PGSQL_USER}
spring.datasource.password=${PGSQL_PASSWORD}package com.example.springexam;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
import lombok.extern.slf4j.Slf4j;
import java.util.List;
@Slf4j
@RestController
@RequestMapping("/api")
public class PieceRestController {
@Autowired
private PieceDao pieceDao;
@GetMapping("/findall")
@ResponseBody
public List<PieceItem> findAll() {
log.info("REST /findall START");
List<PieceItem> res = pieceDao.findAll();
log.info("REST /findall END");
return res;
}
@GetMapping("/findByNumber")
@ResponseBody
public PieceItem getPiece(@RequestParam int number) {
log.info("REST /getPiece {} START", number);
PieceItem res = pieceDao.findByNumber(number);
log.info("REST /getPiece {} END", number);
return res;
}
}
package com.example.springexam;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import java.util.List;
import java.util.Map;
@Service
public class
PieceDao {
@Autowired
private JdbcTemplate jdbcTemplate;
@Transactional
public List<PieceItem> findAll() {
String query = "SELECT * FROM piece_tbl";
List<Map<String, Object>> result = jdbcTemplate.queryForList(query);
List<PieceItem> pieceItems = result.stream().map((Map<String, Object> row) ->
pieceItemFactory(row)
).toList();
return pieceItems;
}
@Transactional
public PieceItem findByNumber(int number) {
String query = "SELECT * FROM piece_tbl WHERE number = ?";
Map<String, Object> result = jdbcTemplate.queryForMap(query, number);
PieceItem pieceItem = pieceItemFactory(result);
return pieceItem;
}
private PieceItem pieceItemFactory(Map<String, Object> row) {
return new PieceItem(
(Long)row.get("id"),
(Integer)row.get("number"),
(String)row.get("name"),
(String)row.get("color"),
(String)row.get("shape"));
}
}
package com.example.springexam;
public record PieceItem (
long id,
int number,
String name,
String color,
String shape
){}module springexam {
requires java.sql;
requires spring.aop;
requires spring.beans;
requires spring.jdbc;
requires spring.context;
requires spring.web;
requires spring.core;
requires spring.boot;
requires spring.boot.autoconfigure;
// When you'd like to use the embedded tomcat.
requires org.apache.tomcat.embed.core;
requires spring.tx;
requires lombok;
requires org.slf4j;
opens com.example.springexam;
}
よか
$ npm install http-proxy-middleware --save
const { createProxyMiddleware } = require('http-proxy-middleware');
const proxy = {
target: 'http://localhost:8080',
changeOrigin: true
}
module.exports = function(app) {
app.use(
'/api',
createProxyMiddleware(proxy)
);
};
import React, { useState, useEffect } from "react";
export const PieceFetch = () => {
const [pieces, setPiece] = useState([]);
useEffect(() => {
fetch("/api/findByNumber?number=1", { method: "GET" })
.then((res) => res.json())
.then((data) => {
setPiece(data);
});
}, []);
return (
<div>
<ul>
<li>{pieces.number}</li>
<li>{pieces.name}</li>
<li>{pieces.color}</li>
<li>{pieces.shape}</li>
</ul>
</div>
);
};import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { PieceFetch } from "./components/PieceComponent"; // Add
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
);
root.render(
<React.StrictMode>
<App />
<PieceFetch />
</React.StrictMode>
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
$ npm start
console.png 542件
[詳細]
product1.png 569件
[詳細]
product2.png 545件
[詳細]
packaging.png 556件
[詳細]
dev2.png 578件
[詳細]
dev1.png 578件
[詳細]
restexec.png 586件
[詳細]
h2-console2.png 496件
[詳細]
h2-console1.png 512件
[詳細]
react8080.png 528件
[詳細]
react.png 553件
[詳細]
rest2.png 404件
[詳細]
rest1.png 386件
[詳細]
jar02.png 695件
[詳細]
jar01.png 681件
[詳細]
import03.png 658件
[詳細]
import04.png 711件
[詳細]
import02.png 675件
[詳細]
import05.png 676件
[詳細]
import06.png 654件
[詳細]
import07.png 625件
[詳細]
import01.png 670件
[詳細]
springinitializer.png 631件
[詳細]
