조약돌 데모 3/1 ~ 3/8 (2018) 커밋

한 일

  • 스트림 프리뷰
    • 글번호 붙이기
    • 글 올리기
    • 글 지우기
  • Materialize 사용

사실 별로 한 일은 많이 없다. 그냥 튜토리얼 5번까지의 내용을 참고해서 메인 페이지를 만든 것.

(Meteor에 연동되는) MongoDB에 posts라는 컬렉션을 만들었다.

튜토리얼 3번 항목에서는 컬렉션을 불러오는 API를 미리 작성하고, 불러온 데이터를 보여주는 프런트를 만들고, 수동으로 컬렉션에 아이템을 넣어주고 있다.

4번에서 입력 폼을 만들어주고, 5번에서 컬렉션에 접근해서 어떤 아이템을 추가, 수정, 삭제하는 기능을 추가하고 있다.

위의 튜토리얼을 거의 그대로 사용해서 posts라는 컬렉션을 구현했다. 추가적인 기능은 각 아이템에 번호를 붙이는 것이 있다. 만들어진 순서대로 1, 2, … n처럼 붙이는데, 만약 몇개가 지워져서 1, 3, 6처럼 되어 있다면 다음 번호는 7번이다. 또 체크박스같은 것들은 넣지 않았다.

/imports/api/posts.js 가 posts컬렉션의 정보를 담당하는 부분이다. get_max()로 최대 글번호를 알아내고 다음 글번호를 정하는 데 쓰인다.

/imports/ui/body.js 에 post 아이템을 추가하는 코드가 있다. Posts.insert() 내부를 보면 JSON형식으로 되어 있는데, 실제 컬렉션에 있는 아이템들도 저런 키들로 구성되어 있다. 일단 글쓴이 정보나 내용은 아무 글이나 있고, 제목만 정할 수 있도록 했다. 또 ‘자세히 보기’ 버튼으로 /view/x로 링크를 걸었는데, 아직 서버에서 라우팅을 안해줘서 그냥 다시 메인 페이지로 온다.

/imports/ui/post.html 에는 템플릿이 들어있는데, Materialize 카드 형식으로 만들었고, 삭제에 사용할 x버튼을 만드려고 했는데 잘 안되길래 그냥 ‘지우기’ 버튼으로 넣었다.

/client/main.html 에 네비게이션을 만들려고 한 흔적이 있다. 잘 안되서 다음으로 미룸.

Materialize는 메테오에서 잘 연동되는 Material Design 프레임워크인 듯 하다. 전부터 깔끔해서 쓸려고 했는데, 여기서도 쓰게 되었다. 필요하면 나중에 바꾸지 머

다음으로 급한 것들은 네비게이션 / 자세히 보기 기능이 있겠다. 자세히 보기를 만드려면 라우팅을 해줘야 되는데, 그건 좀 세팅이 필요할 것 같다. 일단 가이드 따라서 Flow Router를 쓰려고 한다. Iron Router라는 것도 있는데, 무거워 보이기도 하고 다이나믹한 페이지에는 Flow가 좋아보여서 Flow로 선택했다.