remagine

혼자서 웹 서비스 만들어보기 - 7https://github.com/remagine/webNovel/tree/develop 1. 태그 검색 만들기 게시물에는 Tag라는 컬럼이 있습니다. 해당 컬럼은 현재 String(Varchar) 타입 컬럼입니다. 보통 Tag로 검색을 할 때 어떻게 구현할지 생각해 봤습니다. apink라는 단어로 검색을 한다고 해보겠습니다. 만일 Tag가 String 컬럼이라면 "apink, sistar, twice, exo" 이런 식으로 저장이 되어있을 것 입니다. 검색을 구현한다면 select * from story where tag ilike "%apink%" apink를 검색하기 위해선 like 검색에 %를 앞뒤로 붙여줘야 합니다. 이렇게 검색하면 일단 index는 태울 수 없..

혼자서 웹 서비스 만들어보기 - 6https://github.com/remagine/webNovel/tree/develop 사실 매일 조금씩 업데이트는 해왔는데 글로 정리를 못해 죄송하게 생각합니다. 오늘은 Story > Chapter 의 등록과 수정을 만들어 볼까 합니다. 의도한 Flow는 이렇습니다. 1. 글쓰기 버튼을 누른다. 2. 로그인 인터셉터로 session을 체크해서 로그인 페이지로 redirect 혹은 story list 페이지를 반환한다. 3. 사용자가 작성한 Story List가 나옵니다. 여기서 Register를 누릅니다. 4. 이제 Story 작성을 하고 등록을 누릅니다. 5. 등록 결과 메시지나 나오면서 수정페이지로 넘어갑니다. 오른쪽에 Chapter List를 볼 수 있는 nav..

혼자서 웹 서비스 만들어보기 - 5https://github.com/remagine/webNovel/tree/develop CKEditor 파일 업로드 확장자 제한 1. config.js Ckeditor에는 다양한 설정을 도와주는 config.js 파일이 있습니다. http://docs.ckeditor.com/#!/api/CKEDITOR.config 하지만 아무리 찾아봐도 파일업로드 시 확장자 제한이나, 용량제한은 보이지 않습니다. 결국 클라이언트에서 체크하는 것은 어렵고 서버에서 확장자와 용량을 체크하면 좋을 듯 합니다. 2. FileController - extension 먼저 Ckeditor가 파일을 전송해 주면 해당 파일의 확장자를 확인해주는 것을 구현해볼까 합니다. 업로드를 허용하는 확장자를 정..

혼자서 웹 서비스 만들어보기 - 4https://github.com/remagine/webNovel/tree/develop 한동안 업데이트를 못했지만 조금씩 완성해 가고 있었습니다.ㅠㅠ 만드는 것도 어렵지만, 만든 것을 정리해서 올리는 것도 힘들더라구요. 1. 로그인 체크 사이트를 만들다보면 로그인 해야 볼 수 있는 페이지, 서비스가 많습니다. 요청이 들어올 때 로그인 여부를 체크해야 합니다. 여러가지 방법이 있지만 세션에 저장된 로그인 정보가 있는지 확인하는 법이 있습니다. 123456789101112 @RequestMapping(value = "/mypage/profile") public String profile(Model model, HttpSession session, RedirectAttrib..

혼자서 웹 서비스 만들어보기 - 3https://github.com/remagine/webNovel/tree/develop 1. 부트스트랩으로 인덱스 화면 만들기 백엔드 개발자가 이쁜 화면을 맨땅에서 만들어내는 것은 언제나 괴롭습니다. ㅠㅠ 그래도 부트 스트랩이라는 이미 잘 만들어진 css,js 시스템이 있으니 잘 활용해 봅시다. 2. layout 만들기 layout을 만들어 두어야 한다. 왜냐하면 반복되는 html 구조들이 굉장히 많기 때문입니다. 웹 사이트에 있는 header, footer들을 페이지를 만들어 줄 때마다 복사 붙여넣는다고 해봅시다. 처음에 만들때야 ctrl-c, ctrl-v지만 나중에 수정 이슈가 있다면? 페이지가 100개면 100번 수정해야 하고 100% 실수가 있을 것입니다. fo..

혼자서 웹 서비스 만들어보기 - 2https://github.com/remagine/webNovel/tree/develop 1. Css, Js 라이브러리 추가하기 화면을 이쁘게, 멋있게 동작 시켜주는 멋진 Css,JS 라이브러리를 추가해보겠습니다. 보통 이런 라이브러리들은 Jquery를 기반으로 움직이기 때문에 Jquery도 추가해야 합니다. CDN Link를 넣어주는 방법과 직접 프로젝트에 넣어주는 방법이 있는데 프로젝트에 넣어주는 법을 사용했습니다. 다음은 메이븐 프로젝트의 표준 디렉토리 구조입니다. src폴더 안에 main 폴더 안을 주목하세요. 우리는 각종 css, js 들을 /src/main/webapp 폴더 안에 넣을 것입니다. 1. bootstrap - css, js 2. ckeditor -..

혼자서 웹 서비스 만들어보기https://github.com/remagine/webNovel/tree/develop 1. gradle 프로젝트 시작하기 gradle init --type java-library command 창을 열고 원하는 path에서 상기 명령어를 실행시킵니다. 예쁘게 만들어지는 gradle java project(물론 사용하시는 컴퓨터에 gradle이 깔려있어야 합니다.) 2. git에 프로젝트 등록하기 이제 해당 directory 에서 git bash를 실행합니다. 1234567git initgit add .git commit -m "first commit"