Merge pull request #65 from kohei-s/deployment

Deployment

.github/workflows/deploy.yml

@@ -89,7 +89,7 @@ jobs:
           script: |
             docker stop ec2-user
             docker rm ec2-user
-            docker run --pull=always --name ec2-user --publish 80:8080 --detach --env MONGO_DB_URI=${{ secrets.MONGO_DB_URI }} --env DEEPL_API_KEY=${{ secrets.DEEPL_API_KEY }} kokoyuyu/kotoko-app:latest
+            docker run --pull=always --name ec2-user --publish 80:8080 --detach --env MONGO_DB_URI=${{ secrets.MONGO_DB_URI }} --env DEEPL_API_KEY=${{ secrets.DEEPL_API_KEY }} --env GOO_API_ID=${{ secrets.GOO_API_ID }} --env GOO_API_URL=${{ secrets.GOO_API_URL }} kokoyuyu/kotoko-app:latest
             sleep 15s
             docker logs ec2-user
       - name: Check the deployed service URL

.github/workflows/show-logs.yml

@@ -18,7 +18,8 @@ jobs:
       - name: Check the deployed service URL
         uses: jtalk/url-health-check-action@v3
         with:
-          url: http://ec2-3-79-82-35.eu-central-1.compute.amazonaws.com
+#          url: http://ec2-3-79-82-35.eu-central-1.compute.amazonaws.com
+          url: https://kotoko.de
           max-attempts: 3
           retry-delay: 5s
           retry-all: true

README.md

@@ -1,35 +1,45 @@
 
 #  KoToKo: Japanese concentration game app
-This mobile application is developed 🛠️ as my personal capstone project for [Java Development Bootcamp at neue fische](https://www.neuefische.de/en/bootcamp/java-development) from May to August 2023 (try the latest version 👉 [Kotoko](https://kotoko.de))
+This mobile application is originally developed as my Fullstack capstone project for [Java Development Bootcamp at neue fische](https://www.neuefische.de/en/bootcamp/java-development) 2023 (try the latest version 👉 [Kotoko](https://kotoko.de))
 
-[![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=ncloc)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend) [![Coverage](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=coverage)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend) [![Technical Debt](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=sqale_index)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend) \
-\
 ![KoToKo_ver1](https://github.com/kohei-s/kotoko-concentration-app/assets/82062401/b4132c77-a729-490f-ac6c-150da692cf4d)
 (device pixel ratio: 390x844)
+---
+Code analysis with SonarCloud
+- Frontend\
+  [![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=ncloc)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend)
+  [![Reliability Rating](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=reliability_rating)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend)
+  [![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend)
+  [![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-frontend&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-frontend)
+- Backend\
+  [![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-backend&metric=ncloc)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-backend)
+  [![Reliability Rating](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-backend&metric=reliability_rating)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-backend)
+  [![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-backend&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-backend)
+  [![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=kohei-s_kotoko-concentration-app-backend&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=kohei-s_kotoko-concentration-app-backend)
+---
 ## 1. Concept 📱
-New concentration game app aims to support learning Japanese for so called [third culture kids](https://en.wikipedia.org/wiki/Third_culture_kid) growing up speaking a different language in kindergarten or school. The name of the app *KoToKO (言と言)* is a neologism that could mean *Word & Word*.
+New concentration game app aims to support learning Japanese for so called [third culture kids](https://en.wikipedia.org/wiki/Third_culture_kid) growing up speaking a different language in kindergarten or school (👉 [references & sources in research](https://github.com/kohei-s/kotoko-concentration-app/wiki/References-&-Internet-Sourcese)). The name of the app *KoToKO (言と言)* is a neologism that could mean *Word & Word*. 
 ## 2. Problem 😦
 - Difficulty of staying motivated to learn the Japanese language in non-Japanese speaking countries
 - Frustration of not being properly understood in Japanese by their own families
-## 3. MVP 💮
-Simple concentration game with elementary Japanese [Hiragana](https://en.wikipedia.org/wiki/Hiragana) characters 
-## 4. Target group 🧒🏾🧒🏼🧒🏿🧒🏻🧒🏽
+## 3. Target group 🧒🏾🧒🏼🧒🏿🧒🏻🧒🏽
 Children between 5-15 years old learning Japanese as (one of) their home language(s), as well as their parents who want to support the learning journey
-## 5. Core function
+## 4. Core function
+  🎌 Simple concentration game with elementary Japanese characters \
   🪄 Personalize game contents with your favorite Japanese characters \
   📖 Add new characters you're about to learn \
   🗻 Show game records you achieved \
   📚 Expand your Hiragana & Katakana knowledge with additional diacritics cards \
-  🛝 Child friendly design \
-  🔎 Search Japanese character in your strongest language e.g. English or German** \
+  🔎 Search Japanese character in your strongest language e.g. English (or German**) \
   ❤️ Praise your kids for their achievements and keep cheering them (feature for parents)** \
+  🛝 Child friendly design \
   (** upcoming features)
-## 6. Tech Stack
+## 5. Tech Stack
 ### Backend
 Java, Spring Boot, Maven, REST, MongoDB, DeepL API, goo API
 ### Frontend
 JavaScript, TypeScript, CSS, HTML, React, Vite, MUI
-### TDD
+### Testing / Debugging
 JUnit, Mockito, SonarLint, SonarCloud
-### DevOps, CI/CD
-Docker, GitHub Actions, AWS
+### DevOps
+GitHub Projects, Docker, GitHub Actions, AWS

backend/src/main/java/de/neuefische/koheis/backend/converter/ConvertService.java

@@ -1,11 +1,15 @@
 package de.neuefische.koheis.backend.converter;
 
 import de.neuefische.koheis.backend.translation.Translation;
+import io.netty.resolver.DefaultAddressResolverGroup;
 import org.springframework.beans.factory.annotation.Value;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
+import org.springframework.http.client.reactive.ReactorClientHttpConnector;
 import org.springframework.stereotype.Service;
 import org.springframework.web.reactive.function.client.WebClient;
+import reactor.netty.http.client.HttpClient;
+
 import java.util.Objects;
 
 @Service
@@ -17,8 +21,14 @@ public class ConvertService {
 
     public ConvertService(GooConfig gooConfig, @Value("${goo.api.url}") String url, KanaConverter kanaConverter) {
         this.gooConfig = gooConfig;
-        this.webClient = WebClient.create(url);
         this.kanaConverter = kanaConverter;
+        this.webClient = WebClient.builder()
+                .clientConnector(new ReactorClientHttpConnector(
+                        HttpClient.create()
+                                .resolver(DefaultAddressResolverGroup.INSTANCE)
+                ))
+                .baseUrl(url)
+                .build();
     }
 
     public GooRequest getGooRequest(String original, String kanaType) {

frontend/src/App.tsx

@@ -159,7 +159,7 @@ export default function App() {
                                element={<EditGameCard allMyGameCards={allMyGameCards}
                                                       allMyCardSets={allMyCardSets}
                                                       loadAllMyGameCards={loadAllMyGameCards}/>}></Route>
-                        <Route path={"translation"} element={<TranslationCard onSaveCard={loadAllMyGameCards}/>}></Route>
+                        <Route path={"translation/:setName"} element={<TranslationCard onSaveCard={loadAllMyGameCards}/>}></Route>
                         <Route path={"/record"} element={<GameRecord userInfo={userInfo}/>}></Route>
                         <Route path={"/setting"} element={<Setting userInfo={userInfo} update={update}
                                                                    countCardSets={allMyCardSets}/>}></Route>

frontend/src/Collection/NewGameCard.tsx

@@ -16,6 +16,7 @@ type Props = {
 }
 export default function NewGameCard(props: Props) {
 
+    const path = "/translation/" + `${props.cardSetName}`
     const [title, setTitle] = useState<string>("");
     const [reading, setReading] = useState<string>("");
 
@@ -108,7 +109,7 @@ export default function NewGameCard(props: Props) {
                         backgroundColor: "#3c7ee8",
                         boxShadow: 0,
                         borderRadius: '10px'
-                    }}><Link id={"link-translation"} to="/translation"><TranslateIcon fontSize={"small"}/></Link></IconButton>
+                    }}><Link id={"link-translation"} to={path}><TranslateIcon fontSize={"small"}/></Link></IconButton>
                 </CardActions>
             </Card>
         </>

frontend/src/Collection/NewGameCardSet.tsx

@@ -99,7 +99,6 @@ export default function NewGameCardSet(props: Props) {
                             boxShadow: 0,
                             borderRadius: '15px'
                         }}><CheckBoxIcon/></Button>
-
                         <Modal
                             className={"modal-new-card"}
                             open={isNewCardModalOpen}
@@ -109,7 +108,6 @@ export default function NewGameCardSet(props: Props) {
                                 <NewGameCard cardSetName={cardSetName} onClose={closeNewCardModal} onSaveCard={props.onClose} onAddNewCard={props.onAddNewCard}/>
                             </div>
                         </Modal>
-
                         <Button id={"new-card-button"} onClick={props.onClose} sx={{
                             m: 5,
                             color: "#D05F5F",

frontend/src/Translation/TranslationCard.tsx

@@ -18,13 +18,17 @@ import LibraryAddIcon from '@mui/icons-material/LibraryAdd';
 import "./TranslationCard.css"
 import {Conversion} from "./Conversion.ts";
 import {GameCard} from "../Game/GameCard.ts";
+import {useParams} from "react-router-dom";
+
 
 type Props = {
     onSaveCard: () => void
 }
 
 export default function TranslationCard(props: Props) {
 
+    const params = useParams()
+    const setName: string = params.setName as string
     const [translation, setTranslation] = useState<Translation>();
     const [originalWord, setOriginalWord] = useState<string>("");
     const [conversion, setConversion] = useState<Conversion>();
@@ -83,7 +87,7 @@ export default function TranslationCard(props: Props) {
             "/api/game_cards", {
                 "title": title,
                 "reading": conversion?.alphabet,
-                "cardSetName": "new words"
+                "cardSetName": setName
             } as GameCard)
             .then(()=> {
                 closeSelectModal()