Development

.gitignore

@@ -0,0 +1,3 @@
+server/node_modules/
+dojangpedia/node_modules/
+sserver/.env

README.md

@@ -1 +1,2 @@
-# IP-RMT52
+[![Open in Visual Studio Code](https://classroom.github.com/assets/open-in-vscode-2e0aaae1b6195c2367325f4f02e2d04e9abb55f0b24a779b69b11b9e10269abc.svg)](https://classroom.github.com/online_ide?assignment_repo_id=15508199&assignment_repo_type=AssignmentRepo)
+# Individual Project Phase 2

Relation On Server.md

@@ -0,0 +1,30 @@
+Berikut adalah beberapa relasi antara tabel-tabel berdasarkan gambar yang kamu berikan:
+
+### Users dan Basics:
+Tabel Basics punya kolom UserId, artinya tabel ini berhubungan dengan tabel Users. Satu pengguna (Users) bisa punya banyak entri di Basics.
+**Relasi: Satu User ke Banyak Basics.**
+
+### Belts dan Basics:
+Tabel Basics punya kolom BeltId, artinya tabel ini berhubungan dengan tabel Belts. Satu Belt bisa terkait dengan banyak Basics.
+**Relasi: Satu Belt ke Banyak Basics.**
+
+### Basics dan Tekniks:
+Tabel Tekniks punya kolom BasicId, artinya ada hubungan antara Basics dan Tekniks. Satu Basic bisa punya banyak Tekniks.
+**Relasi: Satu Basic ke Banyak Tekniks.**
+
+### Athletes:
+Tabel Athletes tampaknya independen karena tidak ada foreign key yang terlihat. Jika ada hubungan dengan tabel lain seperti Belts atau Users, itu tidak terlihat dari gambar.
+
+### HomePages:
+Tabel HomePages juga tampaknya independen dan tidak punya foreign key yang menunjukkan hubungan dengan tabel lain. Jika tabel ini untuk menyimpan informasi statis atau konten umum, tidak punya relasi bisa jadi wajar.
+
+### Tekniks:
+Tabel Tekniks punya relasi dengan Basics melalui BasicId. Ini menunjukkan teknik yang terkait dengan kategori dasar tertentu.
+
+### SequelizeMeta:
+Tabel SequelizeMeta biasanya digunakan oleh Sequelize untuk menyimpan informasi migrasi database dan tidak berhubungan langsung dengan skema tabel utama yang kamu gunakan.
+
+Berikut adalah diagram relasi (ERD) yang menggambarkan hubungan tersebut:
+- Users → Basics (Satu ke Banyak)
+- Belts → Basics (Satu ke Banyak)
+- Basics → Tekniks (Satu ke Banyak)

catatan livecode 2.txt

@@ -0,0 +1,78 @@
+### untuk react
+REACT
+1. Vite.js - npm create vite@latest
+2. Nama proyek: > react
+3. Pilih framework: > React
+4. Pilih varian: > JavaScript + SWC
+5. Masuk ke direktori proyek: cd react
+6. Instal dependensi: npm install
+7. Jalankan server pengembangan: npm run dev
+
+### untuk server
+
+Install json-server:
+    npm i [email protected]
+
+Untuk menjalankan server:
+npx json-server --watch db.json
+
+Untuk jalankan server di port berbeda:
+npx json-server --watch db.json --port 3001
+
+### instal kebutuhan lain lain 
+
+### instal axios
+npm install axios
+
+### > konfigurasi axios
+1. buat file axiosInstance.js di folder src/config
+2. tambahkan kode berikut di axiosInstance.js:
+### > isi axios instance
+1. import axios dari 'axios'
+2. buat variabel instance axios.create dengan baseURL 'http://localhost:3000'
+3. export instance sebagai default
+
+### > instal react-router-dom
+1. npm install react-router-dom
+
+### > isi react-router-dom
+
+1. import komponen-komponen dari react-router-dom seperti BrowserRouter, Route, Switch, Link, dan useNavigate dari react-router-dom
+
+### > Konfigurasi react-router-dom
+1. import komponen-komponen dari react-router-dom seperti BrowserRouter, Route, Switch, Link, dan useNavigate dari react-router-dom
+2. Bungkus aplikasi utama dengan BrowserRouter
+3. Buat rute-rute menggunakan komponen Route di dalam Switch
+4. Gunakan Link untuk navigasi antar halaman
+5. Gunakan useNavigate untuk navigasi programatik
+
+
+### bikin folder server
+1. mkdir server 
+2. cd server
+3. npm init -y
+4. npm i [email protected]
+
+### bikin file db.json
+1. touch db.json
+2. buat struktur data di db.json
+3. jalankan server
+4. npm run server / npx json-server --watch db.json
+
+### import yang dibutuhkan
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { BrowserRouter, Route, Switch, Link, useNavigate } from 'react-router-dom';
+import axios from 'axios';
+
+### cara route
+
+
+### link bootstrap
+1. <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+### link bootstrap nav
+1.  https://getbootstrap.com/docs/5.3/components/navs-tabs/
+
+### link html ke jsx
+1. https://transform.tools/html-to-jsx

dojangpedia/.eslintrc.cjs

@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
+  settings: { react: { version: '18.2' } },
+  plugins: ['react-refresh'],
+  rules: {
+    'react/jsx-no-target-blank': 'off',
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}

dojangpedia/.firebase/hosting.ZGlzdA.cache

@@ -0,0 +1,11 @@
+vite.svg,1722317112989,699a02e0e68a579f687d364bbbe7633161244f35af068220aee37b1b33dfb3c7
+assets/tekundu.png,1723126419304,ca8c8be1553b311203760fb7e69d668601bea7a4d09f428d621f4ed5d74bc0ee
+assets/tekondo.png,1723126143228,0cc3259f2d7f42a608fa2440cc6be63554ac439ba2ba7901150807a9f208961e
+assets/taekwondo100.jpg,1723124779866,74e16adae9771f11f4ea49a3271125e15618885e57fd32cd46ecb6cc225b4b56
+assets/taekwondo1.png,1722932064936,7fd9cf5d878d9d6dac4859edbfb3871814726266307732f7b72d6e51a8b4664d
+assets/taekwondo.png,1722931680556,38b1f112f0e186ea0701ffe9bc50f912a70c14218bdf7001694e26bc639f49e1
+assets/kick taekwondo.webp,1723125862166,de3f224dc38360efd8b240bd7eddac62c2e9d47998be3ed74c89716a268430f3
+index.html,1725566238642,0264d4b4322f37de60bc21862b6c12a19c7a116c0d00660dc8fcec65f5e62827
+assets/index-BSj3RRru.css,1725566238651,d75477dc47341bfc7a915040235d16d0fa2b487d96d39a078878d9a246733b64
+assets/taekwondo100-9wQ6OmQT.jpg,1725566238651,74e16adae9771f11f4ea49a3271125e15618885e57fd32cd46ecb6cc225b4b56
+assets/index-V13xAmRn.js,1725566238651,9af095d61b9f0e01bb7175befd033481f6a1e1925340a9df443f8624125953b5

dojangpedia/.firebaserc

@@ -0,0 +1,10 @@
+{
+  "projects": {
+    "default": "dojangpedia1",
+    "deploy": "dojangpedia1",
+    "y": "dojangpedia1"
+  },
+  "targets": {},
+  "etags": {},
+  "dataconnectEmulatorConfig": {}
+}

dojangpedia/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

dojangpedia/README.md

@@ -0,0 +1,8 @@
+# React + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

dojangpedia/database.rules.json

@@ -0,0 +1,6 @@
+{
+    "rules": {
+      ".read": false,
+      ".write": false
+    }
+  }

dojangpedia/firebase.json

@@ -0,0 +1,19 @@
+{
+  "database": {
+    "rules": "database.rules.json"
+  },
+  "hosting": {
+    "public": "dist",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ],
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}

dojangpedia/index.html

@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="https://accounts.google.com/gsi/client" async></script>
+    <script type="module" src="/src/main.jsx"></script>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+  </body>
+</html>