스프링부트로 시작하는 웹 프로젝트!

강의 목록

https://www.youtube.com/playlist?list=PLmAWMAo-opQwl2v5CA2-mcWqjQHqtYcZR

강사 연락처

• 박상원 강사

• qoro@naver.com

관련링크

• 강사 리포지터리

• Spring Initializr

설치 프로그램

• 인텔리제이

• GIT

• XAMPP

• SQLYOG

D2coding 폰트사용

• D2coding 폰트

  • D2Coding-Ver1.3.2-20180524.zip

  • 압축해제

  • D2Coding/D2CodingBold-Ver1.3.2-20180524.ttf 만 설치

깃 명령어

git init
git remote add origin [원격리포지터리 주소]
git config --globar user.name [이름]
git config --globar user.email [이메일]
git status
git add .
git commit -m "세팅"
git push orgin master

강의

1강

• 영상 - 22 10 13, ken 10787, 1강, 개요

2강

• 영상 - 22 10 13, ken 10787, 2강, 인텔리제이 설치 및 세팅

3강

• 영상 - 22 10 13, ken 10787, 3강, xampp, SqlYog 설치 및 세팅

4강

• 영상 - 22 10 13, ken 10787, 4강, git 설치

5강

• 영상 - 22 10 13, ken 10787, 5강, 프로젝트 세팅

• application.yml 에 적용

server:
  port: 8081
spring:
  profiles:
    active: dev
  datasource:
    driver-class-name: org.mariadb.jdbc.Driver
    # driver-class-name: net.sf.log4jdbc.sql.jdbcapi.DriverSpy
    url: jdbc:mariadb://127.0.0.1:3306/sb_app_2022_10_14?useUnicode=true&characterEncoding=utf8&autoReconnect=true&serverTimezone=Asia/Seoul
    username: root
    password:

6강

• 영상 - 22 10 13, ken 10787, 6강, 프로젝트의 소스코드를 관리하기 위한 리포지터리 생성

• 메인 리포지터리, https://github.com/SangWon7242/sb_app_2022_10_13

7강

• 영상 - 22 10 13, ken 10787, 7강, git init 으로 로컬 저장소(.git 폴더) 생성

8강

• 영상 - 22 10 13, ken 10787, 8강, git remote add origin 으로 로컬 저장소를 원격 저장소와 연결

9강

• 영상 - 22 10 13, ken 10787, 9강, git config user 로 로컬 저장소에게 작업자가 누군지 알려줌

10강

• 영상 - 22 10 13, ken 10787, 10강, git으로 공유하고 싶지 않은 부분을 결정하는 .gitignore

11강

• 영상 - 22 10 13, ken 10787, 11강, git status, git add, git commit 으로 로컬저장소에 소스코드 저장

12강

• GIT

• 영상 - 22 10 13, ken 10787, 12강, git push origin master 로 로컬저장소(.git 폴더)의 파일들을 원격저장소에 업로드

13강

• 영상 - 22 10 13, ken 10787, 13강, 인텔리제이 프로젝트에서 github 원격저장소, git을 삭제 후 다시 만드는 방법, git관련 오류해결

14강

• 영상 - 22 10 13, ken 10787, 14강, git pull origin master 를 이용해서 새로운 환경에 기존에 작업된 소스코드 받아오는 방법

15강

• GIT

• 영상 - 22 10 13, ken 10787, 15강, 컨트롤러 테스트

16강

• 영상 - 22 10 13, ken 10787, 16강, MVC 개념과 스프링부트에서의 MVC

17강

• 영상 - 22 10 13, ken 10787, 17강, 프레임워크 개요

18강

• GIT

• 영상 - 22 10 13, ken 10787, 18강, /usr/home/main2, /usr/home/main3 추가

19강

• 영상 - 22 10 18, ken 10787, 19강, 새로운 환경에서 작업을 이어가는 방법

20강

• GIT

• 영상 - 22 10 18, ken 10787, 20강, count변수의 값 초기화 액션 구현

21강

• GIT

• 영상 - 22 10 18, ken 10787, 21강, count변수의 값 초기화 액션 구현

22강

• GIT

• 영상 - 22 10 18, ken 10787, 22강, count 조절 액션 구현

23강

• GIT

• 영상 - 22 10 18, ken 10787, 23강, 액션메서드에서 각종 리턴타입 실험

24강

• GIT

• 영상 - 22 10 18, ken 10787, 24강, 게시물 컨트롤러에, 게시물 추가, 리스트 기능 구현

• 목표

• 프로젝트 세팅 후, 24강의 기능을 5분안에 만들 수 있어야 합니다.

25강

• GIT

• 영상 - 22 10 20, ken 10787, 25강, 테스트용 게시물 10개 자동생성

26강

• GIT

• 영상 - 22 10 20, ken 10787, 26강, writeArticle 메서드를 통해서 게시물 작성로직 중복제거

27강

• GIT

• 영상 - 22 10 20, ken 10787, 27강, getArticle, deleteArticle 서비스 메서드로 게시물 삭제기능 구현

28강

• GIT

• 영상 - 22 10 20, ken 10787, 28강, 게시물 수정 액션

29강

• GIT

• 영상 - 22 10 20, ken 10787, 29강, 게시물 상세보기 액션

30강

• 영상 - 22 10 20, ken 10787, 30강, MVC 개념

31강

• 영상 - 22 10 20, ken 10787, 31강, 스프링부트에서의 MVC

32강

• GIT

• 영상 - 22 10 20, ken 10787, 32강, ArticleService 추가 후 UsrArticleController에 연결

33강

• GIT

• 영상 - 22 10 20, ken 10787, 33강, UsrArticleController의 서비스 로직을 ArticleService 로 옮김

34강

• 영상 - 22 10 20, ken 10787, 34강, 기존내용 복습하는 방법

35강

• GIT

• 영상 - 22 10 21, ken 10787, 35강, ArticleService에 있던 단순 데이터 저장과 관련된 로직은 ArticleRepository 으로 옮김

36강

• GIT

• 영상 - 22 10 21, ken 10787, 36강, DB 스키마 생성, 게시물 테이블 생성, DB 접속정보 수정

37강

• GIT

• 영상 - 22 10 21, ken 10787, 37강, 마이바티스, MySQL JDBC 드라이버 추가, 설정 파일에 DB접속정보 기입

38강

• GIT

• 영상 - 22 10 21, ken 10787, 38강, DELETE, UPDATE, SELECT 관련 쿼리를 메서드와 연결

39강

• GIT

• 영상 - 22 10 21, ken 10787, 39강, INSERT 쿼리를 메서드와 연결, last_insert_id 사용

40강

• GIT

• 영상 - 22 10 25, ken 10787, 40강, 게시물 수정시, 입력된 정보만 수정

41강

• 영상 - 22 10 25, ken 10787, 41강, HTML, CSS, JS 연습툴 코드펜, 세팅하는 방법

• 코드펜, https://codepen.io/

42강

• 영상 - 22 10 25, ken 10787, 42강, 테일윈드 소개 및 사용법

• 새 코드펜

• CODEPEN - 테일윈드 사용

• 테일윈드 치트시트, https://nerdcave.com/tailwind-cheat-sheet

43강

• 영상 - 22 10 25, ken 10787, 43강, 무조건 봐야하는, CSS 튜토리얼 5종 소개

• CSS 선택자 튜토리얼, CSS DINER, https://flukeout.github.io/

• CSS FELX 튜토리얼, flex 개구리, https://flexboxfroggy.com/

• CSS FELX 튜토리얼, flex 디펜스, http://www.flexboxdefense.com/

• CSS FELX 총정리, flex play ground, https://codepen.io/enxaneta/full/adLPwv

• CSS GRID 튜토리얼, GRID GARDEN, https://cssgridgarden.com/

• 추가

  • 웹 코딩 기초. ken/9430

44강

• 영상 - 22 10 25, ken 10787, 44강, 자바스크립트 기초 튜토리얼 소개

• 프로그래머스 자바스크립트 입문 강의

  • 풀이, to2.kr/cAD

    • 풀이에 나온 정답을 기준으로 처음부터 끝까지, 힌트없이 문제를 혼자힘으로 푸는데, 30분이 넘으면 안됩니다.

45강

• GIT

• 영상 - 22 10 25, ken 10787, 45강, 회원가입을 처리하기 위해, UsrMemberController, MemberService 추가

46강

• GIT

• 영상 - 22 10 25, ken 10787, 46강, 회원 테이블 추가

47강

• GIT

• 영상 - 22 10 25, ken 10787, 47강, MemberRepository 추가, 회원가입 처리

48강

• GIT

• 영상 - 22 10 27, ken 10787, 48강, 회원가입 완료 후, 생성된 회원 보여줌

49강

• GIT

• 영상 - 22 10 27, ken 10787, 49강, 회원가입시, 로그인아이디 중복 체크

50강

• GIT

• 영상 - 22 10 27, ken 10787, 50강, 회원가입 시, 입력데이터 유효성 체크

51강

• GIT

• 영상 - 22 10 27, ken 10787, 51강, 회원가입 시, 입력데이터 유효성 체크, 공백도 체크

52강

• GIT

• 영상 - 22 10 27, ken 10787, 52강, Ut.empty 함수 도입

53강

• GIT

• 영상 - 22 10 27, ken 10787, 53강, 회원가입시, 이름+이메일 중복체크

54강

• GIT

• 영상 - 22 10 27, ken 10787, 54강, Ut.f 함수 도입으로 복잡한 문장 구성을 편하게

55강

• 영상 - 22 11 01, ken 10787, 55강, 현재까지의 구조에서의 문제점과 ResultData 클래스의 필요성

56강

• 영상 - 22 11 01, ken 10787, 56강, ResultData 클래스의 필요성 다시 설명

57강

• GIT

• 영상 - 22 11 01, ken 10787, 57강, 범용 보고서 클래스, ResultData 구현

58강

• GIT

• 영상 - 22 11 01, ken 10787, 58강, usr/article/getArticle 에 ResultData 적용

59강

• GIT

• 영상 - 22 11 01, ken 10787, 59강, /usr/article/doAdd 에 ResultData 적용

60강

• GIT

• 영상 - 22 11 01, ken 10787, 60강, /usr/article/getArticles 에 ResultData 적용

61강

• GIT

• 영상 - 22 11 01, ken 10787, 61강, /usr/member/doJoin 에 ResultData 적용

62강

• GIT

• 영상 - 22 11 01, ken 10787, 62강, ResultData 클래스에 제너릭 기능 추가

63강

• GIT

• 영상 - 22 11 01, ken 10787, 63강, /usr/article/doAdd 에 ResultData.newData 적용

64강

• GIT

• 영상 - 22 11 01, ken 10787, 64강, /usr/article/doDelete, doModify에 ResultData 적용

65강

• GIT

• 영상 - 22 11 03, ken 10787, 65강, UsrMemberController, MemberService 에 ResultData 제너릭 적용

66강

• 영상 - 22 11 03, ken 10787, 66강, 62강 ~ 65강 내용 정리

67강

• GIT

• 영상 - 22 11 03, ken 10787, 67강, Article 클래스에 regDate, updateDate 필드 추가

68강

• GIT

• 영상 - 22 11 03, ken 10787, 68강, 로그인 기능 구현

69강

• GIT

• 영상 - 22 11 03, ken 10787, 69강, 로그아웃 기능 구현

70강

• GIT

• 영상 - 22 11 03, ken 10787, 70강, 게시물 테이블에 회원번호칼럼 추가

71강

• GIT

• 영상 - 22 11 03, ken 10787, 71강, 게시물 작성시, 로그인 여부 체크, 작성자 정보 저장

72강

• GIT

• 영상 - 22 11 03, ken 10787, 72강, 게시물 삭제시 권한체크

73강

• 영상 - 22 11 03, ken 10787, 73강, 복습하는 방법, 메서드 하나를 재구현하는 방법

• 모든 소스코드를 마지막 커밋시점 으로 되돌리는 명령어

  • git checkout -f .

74강

• 영상 - 22 11 03, ken 10787, 74강, 복습하는 방법, 과거로 돌아가서 특정 기능을 구현해보는 방법

• 특정 커밋 시점으로 가는 명령어(즉 소스코드 전체를 과거로 돌리는 명령어)

  • git checkout -f 커밋번호

    • EX : git checkout -f 16eb5339952c7f1b6057d4cb5c8813179c4815dd

      • 64강이 완료된 직후로 이동

    • 과거로 이동했다면, 꼭, db/schema.sql 파일을 다시 열어서(꼭 다시 열어야 함) 실행해야 과거의 상황을 완벽히 재현할 수 있다.

• 다시 현재로 돌아오는 명령어(아래 2개의 명령어를 순서대로 입력)

  • git checkout -f .

  • git checkout -f master

75강

• GIT

• 영상 - 22 11 03, ken 10787, 75강, 게시물 수정시 권한체크

76강

• GIT

• 영상 - 22 11 03, ken 10787, 76강, ResultData 에 data1Name 추가

77강

• GIT

• 영상 - 22 11 04, ken 10787, 77강, JSP 적용

78강

• GIT

• 영상 - 22 11 04, ken 10787, 78강, 게시물 리스트, JSP로 구현

79강

• GIT

• 영상 - 22 11 04, ken 10787, 79강, 사이트 헤더 작업

80강

• GIT

• 영상 - 22 11 04, ken 10787, 80강, 사이트 공통 CSS, JS 로딩, 지마켓 산스 적용

81강

• GIT

• 영상 - 22 11 04, ken 10787, 81강, 각 페이지별로 중복되는, 공통 상단내용 부분을 head.jspf 로 모으기

82강

• GIT

• 영상 - 22 11 04, ken 10787, 82강, 프론트엔드 라이브러리 불러오기

83강

• 테일윈드 치트시트

• GIT

• 영상 - 22 11 04, ken 10787, 83강, 전체 페이지 레이아웃

84강

• 영상 - 22 11 04, ken 10787, 84강, 복습하는 방법, 공부하는 방법

85강

• GIT

• 영상 - 22 11 04, ken 10787, 85강, 게시물 상세페이지 구현

86강

• GIT

• 영상 - 22 11 04, ken 10787, 86강, 게시물 리스트 칼럼 너비 조정

87강

• GIT

• 영상 - 22 11 04, ken 10787, 87강, 게시물 리스트에서 작성자명 표기

88강

• GIT

• 영상 - 22 11 08, ken 10787, 88강, 게시물 상세페이지에서 작성자명 표시

89강

• GIT

• 영상 - 22 11 08, ken 10787, 89강, 게시물 상세페이지에서 삭제, 수정 버튼 추가

90강

• GIT

• 영상 - 22 11 08, ken 10787, 90강, 출력용 게시물 가져올 때, 액터가 해당 게시물을 삭제/수정 할 수 있는지도 파악

91강

• GIT

• 영상 - 22 11 08, ken 10787, 91강, 게시물 삭제 후 replace로 이동

92강

• 영상 - 22 11 08, ken 10787, 92강, 89 ~ 91강 내용 정리

93강

• GIT

• 영상 - 22 11 08, ken 10787, 93강, Rq 클래스 도입으로 로그인 여부와 관련된 중복된 로직 제거

94강

• GIT

• 영상 - 22 11 10, ken 10787, 94강, BeforeAction 인터셉터 구현

95강

• GIT

• 영상 - 22 11 10, ken 10787, 95강, BeforeAction 인터셉터 등록

96강

• GIT

• 영상 - 22 11 10, ken 10787, 96강, Rq객체를 BeforeAction 인터셉터에서 대표로 한번만 만들기

97강

• GIT

• 영상 - 22 11 10, ken 10787, 97강, NeedLogin인터셉터 구현 및 등록

98강

• GIT

• 영상 - 22 11 10, ken 10787, 98강, NeedLogin인터셉터가 여러 액션들을 대신해서 자격없는 요청들을 앞선에서 거름

99강

• GIT

• 영상 - 22 11 10, ken 10787, 99강, 로그인 폼

100강

• 영상 - 22 11 10, ken 10787, 100강, 로그인 폼과 로그인 처리의 과정 설명

101강

• GIT

• 영상 - 22 11 10, ken 10787, 101강, 로그인 처리에 Rq 적용

102강

• GIT

• 영상 - 22 11 15, ken 10787, 102강, 로그아웃 처리에 Rq 적용

103강

• GIT

• 영상 - 22 11 15, ken 10787, 103강, 로그아웃 후에, 자바스크립트로 후처리

104강

• GIT

• 영상 - 22 11 15, ken 10787, 104강, 게시물 수정폼을 보여주기전 체크

105강

• GIT

• 영상 - 22 11 15, ken 10787, 105강, 게시물 수정 폼

106강

• GIT

• 영상 - 22 11 15, ken 10787, 106강, 게시물 수정 후에, 자바스크립트로 후처리

107강

• GIT

• 영상 - 22 11 15, ken 10787, 107강, 데이지UI적용

108강

• GIT

• 영상 - 22 11 15, ken 10787, 108강, 화면너비 800px 이하 부터는 반응형 끄기

109강

• GIT

• 영상 - 22 11 15, ken 10787, 109강, 게시물 작성 폼

110강

• GIT

• 영상 - 22 11 17, ken 10787, 110강, 게시물 작성의 후처리를 자바스크립트로 수행

111강

• GIT

• 영상 - 22 11 17, ken 10787, 111강, 멀티게시판 개념 도입, board 테이블 생성

112강

• GIT

• 영상 - 22 11 17, ken 10787, 112강, 게시물리스트에서 선택된 게시판의 이름을 페이지 제목으로 노출

113강

• 영상 - 22 11 17, ken 10787, 113강, HttpServletRequest, HttpServletResponse, HttpSession 개념 설명

114강

• 영상 - 22 11 17, ken 10787, 114강, Article 클래스의 extra__actorCanModify, extra__actorCanDelete 필드의 역할과 초기화 방법

115강

• GIT

• 영상 - 22 11 17, ken 10787, 115강, 게시물리스트에서 존재하지 않는 게시판 체크

116강

• GIT

• 영상 - 22 11 17, ken 10787, 116강, 게시물리스트에 선택된 게시판에 관련된 게시물만 표시

117강

• GIT

• 영상 - 22 11 18, ken 10787, 117강, 게시물리스트에 게시물개수 표시

118강

• GIT

• 영상 - 22 11 18, ken 10787, 118강, 게시물 페이징을 위한 게시물 대량생성

119강

• GIT

• 영상 - 22 11 18, ken 10787, 119강, Rq 객체의 생성을 스프링에 맡김

120강

• GIT

• 영상 - 22 11 18, ken 10787, 120강, 게시물 작성시 게시판 선택

121강

• GIT

• 영상 - 22 11 18, ken 10787, 121강, BeforeActionInterceptor 에서 Rq 객체를 좀 더 확실하게 생성되도록 유도

122강

• GIT

• 영상 - 22 11 18, ken 10787, 122강, 게시물 리스트 page 파라미터 처리

123강

• GIT

• 영상 - 22 11 18, ken 10787, 123강, 페이지 메뉴 구현

124강

• GIT

• 영상 - 22 11 18, ken 10787, 124강, 페이지 메뉴의 크기를 동적으로 조정

125강

• GIT

• 영상 - 22 11 18, ken 10787, 125강, 페이지 메뉴의 최대크기를 지정

125강

• GIT

• 영상 - 22 11 22, ken 10787, 125강, 페이지 메뉴를 통해서 페이지 이동을 해도, 선택된 게시판 정보가 누락되지 않도록

126강

• GIT

• 영상 - 22 11 22, ken 10787, 126강, 데이지UI에서 명시적으로 다크모드가 활성되지 않도록 지정

127강

• GIT

• 영상 - 22 11 22, ken 10787, 127강, 리스트에서 검색타입과 검색어에 따라, 총 게시물 수 계산 구현

128강

• GIT

• 영상 - 22 11 22, ken 10787, 128강, 게시물 검색어에 따라 게시물 필터, 게시물 페이지메뉴에 검색어 유지

129강

• GIT

• 영상 - 22 11 22, ken 10787, 129강, 게시물 리스트의 테이블 꾸미기

130강

• GIT

• 영상 - 22 11 22, ken 10787, 130강, 검색박스 구현

131강

• GIT

• 영상 - 22 11 22, ken 10787, 131강, 게시물 상세페이지가 보여질 때 마다, 조회수 1 증가

꼭 보고 올것

• Ajax가 무엇인지 설명하는 영상 (+CORS, fetch 어쩌구)

• jQuery - ajax

• 10분 테코톡, 티거의 Ajax

132강

• GIT

• 영상 - 22 11 24, ken 10787, 132강, 조회수 증가를 다른 액션에서 수행

133강

• GIT

• 영상 - 22 11 24, ken 10787, 133강, 조회수 증가를 ajax로 실행

134강

• GIT

• 영상 - 22 11 24, ken 10787, 134강, 조회수 증가 성공에 대한 답장에, data2(글 번호) 정보 추가

135강

• GIT

• 영상 - 22 11 24, ken 10787, 135강, 로컬스토리지를 이용해서 브라우저가 한번 읽은 게시물에 대해서는 조회수 증가 요청 안함

136강

• 영상 - 22 11 24, ken 10787, 136강, 크롬 개발자 도구, 네트워크 탭 사용법

137강

• GIT

• 영상 - 22 11 24, ken 10787, 137강, 리액션포인트 테이블 추가

138강

• GIT

• 영상 - 22 11 24, ken 10787, 138강, 시간출력관련 함수를 Article 클래스에 만들어서 JSP에서 사용

139강

• GIT

• 영상 - 22 11 29, ken 10787, 139강, 게시물리스트에, 추천수 노출 구현

140강

• GIT

• 영상 - 22 11 29, ken 10787, 140강, 상세페이지, 수정페이지에서도 추천수 노출

141강

• GIT

• 영상 - 22 11 29, ken 10787, 141강, 각 게시물에서 사용자가 좋아요와 싫어요를 할 수 있는지 체크

142강

• GIT

• 영상 - 22 11 29, ken 10787, 142강, 쿼리속도 최적화를 위해서, article 테이블에 좋아요, 싫어요 칼럼 추가

143강

• GIT

• 영상 - 22 11 29, ken 10787, 143강, 좋아요, 싫어요 수를 article 테이블에서 손쉽게 가져오는 방식으로 변경

144강

• GIT

• 영상 - 22 12 01, ken 10787, 144강, 리액션포인트서비스, 리액션포인트리포지터리 도입

145강

• GIT

• 영상 - 22 12 01, ken 10787, 145강, 좋아요, 싫어요 구현

146강

• GIT

• 영상 - 22 12 01, ken 10787, 146강, 좋아요 취소버튼, 싫어요 취소버튼을 조건에 따라 노출

147강

• GIT

• 영상 - 22 12 01, ken 10787, 147강, 좋아요, 싫어요 취소처리

148강

• GIT

• 영상 - 22 12 02, ken 10787, 148강, 댓글 테이블 추가

149강

• GIT

• 영상 - 22 12 02, ken 10787, 149강, 댓글작성 폼

150강

• GIT

• 영상 - 22 12 02, ken 10787, 150강, 댓글 폼 체크

151강

• GIT

• 영상 - 22 12 02, ken 10787, 151강, 댓글 작성 처리

151강

• GIT

• 영상 - 22 12 02, ken 10787, 151강, 댓글테이블에 인덱스 걸기

152강

• GIT

• 영상 - 22 12 02, ken 10787, 152강, 댓글 리스트

153강

• GIT

• 영상 - 22 12 02, ken 10787, 153강, 댓글 삭제, 댓글 수정 버튼 노출

154강

• GIT

• 영상 - 22 12 06, ken 10787, 154강, 댓글 삭제

155강

• GIT

• 영상 - 22 12 06, ken 10787, 155강, 댓글 수정 폼

156강

• GIT

• 영상 - 22 12 06, ken 10787, 156강, 댓글 수정 폼 처리

157강

• GIT

• 영상 - 22 12 06, ken 10787, 157강, 마이페이지

158강

• GIT

• 영상 - 22 12 06, ken 10787, 158강, 인터셉터 설정에서 로그인이 필요한 페이지들 추가

159강

• GIT

• 영상 - 22 12 06, ken 10787, 159강, 회원정보수정 폼 처리 중 버그 발견

• myPage.jsp 에서 redirectUri 불러오지 못하는 버그 발생

• 비빌번호 입력시 비빌번호 입력해달라는 버그 발생

• 빠른 처리후 영상 올릴 예정

• 영상 - 22 12 21, ken 10787, 159강, 회원정보수정 폼 처리 오류 문제 해결

향후 계획

• 회원가입

• 아이디 찾기

• 비밀번호 암호화

• 이메일 발송테스트

• 비밀번호 찾기(임시 패스워드 발송)

• needLogin인터셉터에 의해서 막힌 경우

• 로그인 성공시, 원래 가려 했던 곳으로 이동

꼭 봐야할 영상

• 생활코딩 - 관계형 데이터베이스 모델

• 생활코딩 - 오라클

기술서 예시

• 기술서 예시, wiken.io/ken/4789