처음 node.js를 이용해서 백엔드와 프론트를 모두 만들어보고 싶다는 생각을 한 것은 20년 가을 즈음이었다.

20년 초반, 뭘 할 수 있을까 고민하다가 Bootstrap을 이용해 프론트에 발을 들인 게 웹의 시작이었다.

가을부터 해가 바뀌고 나서야 목표를 완성한 것은 솔직히 말도 안되게 느린 것이다.

스스로도 느린 것을 인정한다. 

학기 중에도 처음에는 열정을 가지고 달려 들었지만, 막상 혼자 하려고 하니까 모든 기능의 구현에 있어

한 발자국 나아 갈 때마다 벽에 막히는 듯한 느낌을 받았다. 처음에는 열심히 해결하려고 했지만,

학업을 병행하면서 하니까, 시험기간에는 도저히 이쪽으로는 손이 가질 않았다. 그러다 보니

점차 막히면 좌절을 많이 하게 되었고, 해결을 위해 노력하는 시간도 비중이 줄어갔다.

그래서 이렇게 늦어지지 않았나 생각한다.

개발자들의 여러 블로그를 보면서 마감기한이 중요하다.라는 말을 많이 본 것 같은데,

이제야 그 이유를 어느 정도 알 것 같다. 이번에는 마감기한 없이 하고 싶을 때 하는 느낌이 강했다. 

다음 프로젝트를 시작하게 된다면 마감기한을 설정하고, 최대한 빠르게 해결해 보려고 한다.

 

프로젝트를 끝내고 주저리주저리 적다 보니 배웠던 기술과 보완할 점이 보여서 좋은 것 같다.

'개발일지 > 게시판 만들기' 카테고리의 다른 글

게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #3  (0) 2021.01.07
게시판 만들기 #2  (0) 2021.01.06

2021.01.21

대댓글 기능을 완성했다.

댓글과 대댓글의 구분에 있어 차별을 두기 위해서 대댓글은 들여쓰기 하는 느낌으로 사용자에게 보여지게 했다

구조상 대댓글과 댓글의 작성에 이용되는 라우터가 같기 때문에 

똑같이 출력 되는 현상이 초기에는 존재했다. 

물론 늦장 부린 것도 어느정도 있지만, 이 현상을 해결하느라 고군분투한 것도 작업이 늦어지는 이유에 포함된다.

결론적으로 Schema 변수명과 저장할 때 변수명이 다르게 적혀있어 오류가 발생했던 것이다..

정말 어처구니 없는 실수였는데, 다음부터는 조심하도록 하자

 

일단 여기까지 계획했던 게시판의 기능은 대부분 구현 완료했다. 이번엔 순전히 배포가 아닌 공부목적으로 다음에는 

배포가능한 서비스를 만들어 보려고 한다.

 

 

추가된 개발 상황

 - 대댓글 기능

 

추가할 기능

 - x

 

 

대댓글은 들여쓰기

 

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

부족합니다.

그 점 양해 부탁드립니다.

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

'개발일지 > 게시판 만들기' 카테고리의 다른 글

회고  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #3  (0) 2021.01.07
게시판 만들기 #2  (0) 2021.01.06

2021.01.14

댓글의 수정과 삭제를 완성하고, 대댓글 기능의 틀만 잡아뒀다.

수정과 삭제의 기능 부여는

 1. 글(Post)의 author.

 2. 댓글(Comment)의 author과 현재 로그인된 user.id 가 동일할 때

위 두 가지의 경우에 버튼을 활성화되게 했다. 

 + 추가적으로 관리자(admin) 계정의 경우에도 삭제 기능을 추가하면 좋을 것같다.

댓글이 삭제가 됐다고 가정했을 때 DB에서 완전히 제거하면, 그 아래에 달린 reply들은 Parent를 잃은 고아(orphanage)가 되어버리기 때문에 Comment 모델의 isDeleted 부분을 만들어 이 부분을 true로 함으로써 페이지 상에 표시되지 않게 한다. 

대댓글(reply)의 경우는 로그인된 상태이면 활성화되게 했다.

현재 reply를 저장하게 되면 해당 댓글의 아래가 아닌 맨 아래로 내려가는 현상이 있다.

이 부분은 추후 보완이 필요한 부분이다.

 

 

추가된 개발 상황

 - 댓글의 수정, 삭제 기능

 - 수정, 삭제 기능의 제약

 

추가할 기능

 - 대댓글 기능

 

 

CommentSchema의 구성

 

비로그인 상태일때 추가적인 기능이 안보이게 함. + 삭제된 댓글 처리

 

'flower' 계정으로 로그인한 상태, 추가적인 기능 활성화

 

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

부족합니다.

그 점 양해 부탁드립니다.

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

'개발일지 > 게시판 만들기' 카테고리의 다른 글

회고  (0) 2021.01.21
게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #3  (0) 2021.01.07
게시판 만들기 #2  (0) 2021.01.06

2021.01.13

댓글의 생성까지는 쉬웠으나 수정과 삭제가 매우 까다로웠다.

html의 form태그의 method 속성은 post와 get방식만 지원한다는 것을 알게 되었고,

put과 delete의 처리를 위해선 method override라는 패키지의 설치를 요했다.

하지만 내 케이스는 왠지 모르게 put의 처리가 동작하지 않았고, 임시방편으로 post 형식으로

update를 수행하게 만들었다.

아직은 코드에 수정에 있어 id의 제약을 걸지 않은 상태이다.

 

 

추가된 개발 상황

 - 댓글의 수정(edit) 기능

 

추가할 기능

 - 댓글 수정 id 제약

 - 댓글의 삭제

 - 대댓글 기능

 

 

댓글의 수정 기능 활성화

 

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

부족합니다.

그 점 양해 부탁드립니다.

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

 

'개발일지 > 게시판 만들기' 카테고리의 다른 글

게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #3  (0) 2021.01.07
게시판 만들기 #2  (0) 2021.01.06
[2020.12.01 ~ ] 게시판 만들기 #1  (0) 2021.01.05

2021.01.07

로그인 오류가 언제부턴가 나기 시작했었다.

처음에는 대소문자만 구분을 못하는 건 줄 알았는데, 알고 보니 bcrypt의 compare 함수 부분에서

오류가 있었다. 정확히 말하자면 return 값에 오류가 있어 비밀번호를 제대로 입력하지 않아도 로그인이

되어버리는 현상이 있었다. 

compare 함수의 위치를 User.js(model) 에서 passport.js 로 옮기니 해결되었다.

자세한 이유는 확실히 알게 되면 포스팅할 예정이다.

( 이것 때문에 3시간이나 골머리를 앓았다...)

 

추가된 개발 상황

 - 로그인 오류 수정

 

추가할 기능

 - 댓글의 수정 및 삭제

 - 대댓글 기능

 

원래 User.js에 위치한 compare 함수

 

passport.js로 compare 함수를 이동한 모습

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

부족합니다.

그 점 양해 부탁드립니다.

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

 

'개발일지 > 게시판 만들기' 카테고리의 다른 글

게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #2  (0) 2021.01.06
[2020.12.01 ~ ] 게시판 만들기 #1  (0) 2021.01.05

2021.01.06

게시판의 댓글 작성 기능까지 구현을 완료했다.

작성 외의 수정, 삭제, 대댓글 등은 추후 추가할 예정이다.

댓글은 Comment 라는 새로운 스키마의 생성과

User 와 Post 둘 다 관계를 설정해 줘야 해서 좀 까다로웠다.

 

 

추가된 개발 상황

 - 댓글 기능 추가

 

추가할 기능

 - 댓글의 수정 및 삭제

 - 대댓글

 - 비밀번호 오류가 발생 수정 예정

 

 

댓글 기능 추가

 

MongoDB 생성된 모습

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

부족합니다.

그 점 양해 부탁드립니다.

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

 

'개발일지 > 게시판 만들기' 카테고리의 다른 글

게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #3  (0) 2021.01.07
[2020.12.01 ~ ] 게시판 만들기 #1  (0) 2021.01.05

2021.01.05

처음부터 개발일지를 기록했어야 하지만 블로그를 하겠다는 생각을 실천으로 옮기지 못한 탓에

시작일이 정확하지 않다. 기억나는 날짜를 임의로 12월 즈음으로 설정했다. 

앞으로 개발 상황은 계속 업데이트 할 예정이다.

 

현재까지 개발 상황

 - 메인 페이지 구현

 - 회원가입, 로그인, 로그아웃, 마이페이지 구현

 - 로그인을 passport를 활용하여 로그인 유무에 따른 nav 바 및 기능제약 구현

 - 게시물 보기, 게시글 쓰기 (file[사진], post[본문]) 관계 설정 완료 

 - 게시물을 페이지 당 n개의 게시글로 끊어서 출력하기

 

추가할 기능

 - 댓글 및 대댓글 기능

 - 현재 비밀번호 대소문자 구분에 있어 오류가 있는 듯 하니 수정

 

 

홈 화면

 

회원가입 페이지

 

로그인 페이지

 

my page 및 로그인 시 로그아웃 버튼 활성화

 

전체 게시물 페이지

 

게시물 클릭 시 게시물 페이지로 이동

 

 

 

 

nodejs와 mongoDB를 활용한 간단한 게시판 만들기를 진행해 보았습니다.

CSS와 JS는 bootstrap의 힘을 빌려서 작성했습니다. 개발도구로는 vscode를 사용했습니다.

코드는 아래의 저장소에서 볼 수 있습니다.

처음 공부하고, 만들어 보는 페이지라서 가독성과 클린 코드, 문법 등은

너무 너무 부족합니다.. ㅜ.ㅜ 

그 점 양해 부탁드립니다..

github.com/holicAZ/Nodejs

 

holicAZ/Nodejs

Contribute to holicAZ/Nodejs development by creating an account on GitHub.

github.com

'개발일지 > 게시판 만들기' 카테고리의 다른 글

게시판 만들기 #6  (0) 2021.01.21
게시판 만들기 #5  (0) 2021.01.14
게시판 만들기 #4  (0) 2021.01.13
게시판 만들기 #3  (0) 2021.01.07
게시판 만들기 #2  (0) 2021.01.06