{"id":19349219,"url":"https://github.com/son-b/board-side-project","last_synced_at":"2026-04-07T08:32:19.449Z","repository":{"id":49323772,"uuid":"517319877","full_name":"SoN-B/Board-Side-Project","owner":"SoN-B","description":"개인 사이드 프로젝트를 통하여, 배운 내용을 바로 적용시켜 보거나, 추가적인 공부를 위한 Repo","archived":false,"fork":false,"pushed_at":"2023-04-11T06:03:59.000Z","size":5125,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-24T10:19:06.403Z","etag":null,"topics":["bootstrap","javascript","jwt","md5","mysql","nodejs","sequelize"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SoN-B.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"License","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-07-24T12:37:47.000Z","updated_at":"2023-01-09T12:23:28.000Z","dependencies_parsed_at":"2023-01-31T00:46:09.387Z","dependency_job_id":null,"html_url":"https://github.com/SoN-B/Board-Side-Project","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/SoN-B/Board-Side-Project","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SoN-B%2FBoard-Side-Project","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SoN-B%2FBoard-Side-Project/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SoN-B%2FBoard-Side-Project/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SoN-B%2FBoard-Side-Project/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SoN-B","download_url":"https://codeload.github.com/SoN-B/Board-Side-Project/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SoN-B%2FBoard-Side-Project/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31506562,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T03:10:19.677Z","status":"ssl_error","status_checked_at":"2026-04-07T03:10:13.982Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bootstrap","javascript","jwt","md5","mysql","nodejs","sequelize"],"created_at":"2024-11-10T04:25:21.021Z","updated_at":"2026-04-07T08:32:19.430Z","avatar_url":"https://github.com/SoN-B.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Board 사이드 프로젝트\n\n\u003e**목적** : 개인 사이드 프로젝트를 통하여, 배운 내용을 바로 적용시켜 보거나, 추가적인 공부를 위한 용도\n\n- [MongoDB Board](https://github.com/SoN-B/Node.JS-Board) 개인 스터디 내용을 활용하여, MySQL 시스템으로 전환\n- Passport 로그인 방식 -\u003e JWT 로그인 방식으로 전환\n- Bootstrap 4.0을 활용한 페이지 구성 \u0026 프론트와 백엔드의 통신과정 이해\n\n## 📚 Contents\n\n- [Features](#-Features)\n- [API Reference](#-API-Reference)\n- [Database ERD](#-Database-ERD)\n- [Execution Screens](#-Execution-Screens)\n- [Module](#-Dependency-Module)\n\n## ⚙ Features\n\n1. JWT를 활용한 로그인, 회원가입\n2. Access 토큰 이외 Refresh 토큰을 추가하여 보안 강화\n3. 로컬 스토리지를 활용한 토큰 저장 \u0026 로그아웃\n4. MD5 해시 함수를 활용하여 사용자 비밀번호 단방향 암호화\n5. 기본적인 게시판 CRUD\n6. 페이징 기능 \u0026 해당 페이지에 보여줄 게시글 수 지정 가능\n7. (제목, 내용), (제목), (내용), (작성자)의 종류로 게시글 검색 가능\n8. 해당 게시글 조회 시, 조회 수 증가\n9. 해당 게시글과 현재 로그인된 사용자를 비교하여 특정 권한 지정\n10. 주소 상의 쿼리 스트링을 활용하여, 이전 페이지 기억\n\n## 📝 API Reference\n\n\u003e**HOME**\n\n**GET** / - 홈 화면 렌더링\n\n**GET** /about - 홈페이지에 대한 설명 페이지 렌더링\n\n\u003cbr\u003e\n\n\u003e**USER**\n\n**GET** /user/login - 로그인 페이지 렌더링\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003ePOST\u003c/b\u003e /user/login - 로그인 post 요청\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/user/login.js)\n\n  * 이메일 \u0026 비밀번호 유효성 검사 \u0026 전달\n  \n  * 정상 응답받을 시, 로컬 스토리지에 해당 Access \u0026 Refresh 토큰 저장하고 홈 화면으로 이동\n  \n* [백엔드](./BackEnd/src/controllers/user/service.js)\n\n  * 요청받은 이메일로 유저를 검색하고, 비밀번호 복호화 후 동일하면 Access \u0026 Refresh 토큰 리턴\n\n\u003c/details\u003e\n\n**GET** /user/register - 회원가입 페이지 렌더링\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003ePOST\u003c/b\u003e /user/register - 회원가입 post 요청\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/user/register.js)\n\n  * 유저명 \u0026 이메일 \u0026 비밀번호 전달\n  \n  * 응답받은 코드가 200일시, 로그인 화면 이동\n  \n  * 응답받은 코드가 200이 아닐 시, 에러 메시지 화면 출력\n  \n* [백엔드](./BackEnd/src/controllers/user/service.js)\n\n  * 요청받은 유저명 \u0026 이메일 \u0026 비밀번호 유효성 검사\n  \n  * 유저명 \u0026 이메일 중복체크\n  \n  * 이상 없을 시, 비밀번호 암호화 후 성공 코드 200 반환\n  \n\u003c/details\u003e\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003eGET\u003c/b\u003e /user/profile - 프로필 열람 시, 유저 토큰 검사 요청\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/index.js)\n\n  * 화면상 프로필 클릭 시, 로컬스토리지안의 Access 토큰 전달\n  \n  * 응답받은 코드가 200일시, 유저정보를 파라미터로 파싱 하여, 해당 주소로 이동\n  \n  * 응답받은 코드가 419일시, Refresh 토큰으로 Access 토큰 재발급 요청. 그 후, 재발급 받은 Access 토큰 저장\n  \n  * 응답받은 코드가 이외의 것일 시, 재로그인을 위한 로그인 페이지로 이동\n  \n* [백엔드](./BackEnd/src/controllers/user/service.js)\n\n  * 받은 토큰 검사 후, 해당 토큰에 대한 유저정보 전달\n  \n\u003c/details\u003e\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003eGET\u003c/b\u003e /user/profile/output - 프로필 HTML 렌더링\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/index.js)\n\n  * /user/profile에서 응답받은 유저정보를 파라미터로 파싱 하여, 해당 주소로 이동\n  \n* [백엔드](./BackEnd/src/controllers/user/service.js)\n\n  * 프론트에게 받은 주소 쿼리 \u0026 파라미터가 유지된 채 프로필 HTML 렌더링\n  \n\u003c/details\u003e\n\n**GET** /user/token/refresh - refresh 토큰 받아서, access token 재발급\n\n\u003cbr\u003e\n\n\u003e**BOARD**\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003eGET\u003c/b\u003e /board - 조건에 따른 글 데이터 전달\u003c/summary\u003e\n\n* [프론트](./FrontEnd/views/post/index.ejs)\n\n  * 위 메뉴 'Board'를 클릭 시, /board API 호출\n  \n  * 글 ID, 제목, 조회 수, 작성자, 작성 시간 등을 표시할 수 있다.\n  \n  * 글의 (제목, 글),(제목),(글),(작성자)로 게시글을 검색할 수 있다.\n  \n  * 페이지가 존재하고, 페이지당 표시될 게시글의 수를 정할 수 있다.\n  \n  * New 버튼 클릭 시, 브라우저 내 로컬 스토리지에서 토큰 검사 (토큰이 없을 시, 로그인 화면으로 이동)\n  \n* [백엔드](./BackEnd/src/controllers/board/service.js)\n\n  * 프론트로부터 page, limit, Search 종류 등을 전달받아, 해당 조건에 맞는 게시글로 응답\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003ePOST\u003c/b\u003e /board - 글 생성\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/post/create.js)\n\n  * 제목 \u0026 글 유효성 검사\n  \n  * 작성하고자 하는 제목과, 글을 입력 후 Access 토큰과 함께, 해당 데이터 전달\n  \n  * 글 전달 후, 419코드를 응답받게 되면, Refresh 토큰으로 Access 재발급 요청\n  \n  * 그 이외의 코드는 로그인 화면 이동\n  \n* [백엔드](./BackEnd/src/controllers/board/service.js)\n\n  * 프론트쪽에서부터 전달받은 토큰 검사 후, 해당 데이터로 글 생성\n\n\u003c/details\u003e\n\n**GET** /board/new - 글 생성 페이지 렌더링\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003eGET\u003c/b\u003e /board/:id - id 번호의 글 페이지 렌더링\u003c/summary\u003e\n\n* [프론트](./FrontEnd/views/post/index.ejs)\n\n  * /board 페이지에서 해당 글을 클릭 시, 현재 페이지 \u0026 검색어 등을 기억하며, /board/:id API 호출\n  \n  * 그 후, 페이지에서 항상 작성된 글과 현재 로그인한 사용자와 매칭하여 작성자가 맞는다면, [Back] 버튼 이 외 [Edit], [Delete] 버튼 노출\n  \n  * [Back] \u0026 [Edit] -\u003e 현재 페이지 \u0026 검색어 등을 기억, [Delete] 버튼 작동 시, 1페이지로 이동\n  \n* [백엔드](./BackEnd/src/controllers/board/service.js)\n\n  * 호출 요청을 받고, 파라미터의 id를 파싱 하여 해당 id의 게시글 데이터로 응답과 함께, [작성된 페이지](./FrontEnd/views/post/show.ejs) 렌더링\n  \n  * API 요청당 조회 수 +1\n\n\u003c/details\u003e\n\n**POST**(delete) /board/:id - id 번호의 글 삭제\n\n**GET** /board/:id/edit - id 번호의 글 데이터와 함께, edit 페이지 렌더링\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003ePOST\u003c/b\u003e /board/:id/edit - id 번호의 글 edit 후 post\u003c/summary\u003e\n\n* [프론트](./FrontEnd/public/js/post/update.js)\n\n  * 수정하고자 하는 해당 글의 제목 \u0026 글 유효성 검사\n  \n  * Access 토큰과 함께 수정 API 호출\n  \n* [백엔드](./BackEnd/src/controllers/board/service.js)\n\n  * 프론트로부터 전달받은 데이터로 해당 게시글 내용 변경\n  \n\u003c/details\u003e\n\n\u003cdetails\u003e\n\n\u003csummary\u003e\u003cb\u003eGET\u003c/b\u003e /board/:id/auth - 해당 글 작성자와 로그인 중인 사용자 일치 확인(인증)\u003c/summary\u003e\n\n  * 프론트로부터 토큰을 전달받고, 토큰 검사 후, 주소상 게시글의 id가 토큰에 존재하는 사용자가 작성한 글이 맞는지 확인\n  \n  * 그 후, 해당 글 페이지의 [back] or [back, edit, delete] button 출력여부 결정\n\n\u003c/details\u003e\n\n## ⛓ Database ERD\n![ERD](./readme/erd.PNG)\n\n## 💻 Execution Screens\n\n\u003e**Main**\n\n| ![홈 화면](./readme/home.PNG) | ![로그인](./readme/login.PNG) | ![회원가입](./readme/register.PNG) | ![프로필](./readme/profile.PNG) |\n| :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: |\n|                                                      홈 화면                                                      |                                                       로그인                                                        |                                                      회원가입                                                       |                                                     프로필                                                      |\n\n\u003cbr\u003e\n\n\u003e**Board**\n\n| ![게시판 메인](./readme/board.PNG) | ![게시글 제한](./readme/boardlimit.PNG) | ![글 \u0026 제목 검색](./readme/boardsearchp.PNG) | ![유저 검색](./readme/boardsearchu.PNG) |\n| :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: |\n|                                                      게시판 메인                                                      |                                                       게시글 제한                                                        |                                                      글 \u0026 제목 검색                                                       |                                                     유저 검색                                                      |\n\n\u003cbr\u003e\n\n\u003e**Board Content**\n\n| ![게시글 생성](./readme/new.PNG) | ![게시글 읽기](./readme/show.PNG) | ![게시글 수정](./readme/edit.PNG) | ![게시글 삭제](./readme/delete.PNG) |\n| :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------: |\n|                                                      게시글 생성                                                      |                                                       게시글 읽기                                                        |                                                      게시글 수정                                                       |                                                     게시글 삭제                                                      |\n\n## 🛠 Dependency Module\n\n```\n  \"dependencies\": {\n    \"body-parser\": \"^1.20.0\",\n    \"config\": \"^3.3.7\",\n    \"ejs\": \"^3.1.8\",\n    \"express\": \"^4.18.1\",\n    \"jsonwebtoken\": \"^8.5.1\",\n    \"md5\": \"^2.3.0\",\n    \"mysql2\": \"^2.3.3\",\n    \"sequelize\": \"^6.21.3\",\n    \"sequelize-cli\": \"^6.4.1\"\n  }\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fson-b%2Fboard-side-project","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fson-b%2Fboard-side-project","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fson-b%2Fboard-side-project/lists"}