"Meteor는 프론트와 백엔드를 하나의 언어로 소화할 수 있게 해주는 프레임워크이다."

이 장점으로 보통 상대적으로 소규모 앱에 많이 활용된다는데 스터디를 하면서 진행해보고 장점과 단점을 생각해보자.

🚀 다양한 의견들

1. meteor.js + react.js???
2. db, 백엔드 다루기 어렵다?
3. 환경변수 세팅이 제대로 안되어있어서 db 접속이 안됐다.
4. Meteor는 “미리보기”상태에 있고, 심각한 버그가 있음
5. Meteor의 강점은 현재 작업중인 모든 사람의 업데이트를 볼 수있는 소셜 응용 프로그램 중 일부에 잘 작동하는 실시간 업데이트 기능
6. 프레임워크가 의도하는데로 사용하는 경우는 별 문제가 없지만 그렇지 않다면 그 프레임워크와 싸우게 된다.
7. Node.js version >= 10 and <= 14
8. MongoDB사용함

강의내용

메테오 장점들

Websocket(DDP)를 활용하여 서버에 있는 DB들을 Minimongo 형태로 클라이언트에서 작업을 진행하는 방식이다. fetch하는 경우는 REST API형식을 취한다. 메테오는 테스트 작업들과 커뮤니티가 있기 때문에 조언을 얻기 쉽다.

실제 코드와 미니 프로젝트들로 장점들을 확인해보자.
(Meteor.js에서 제공하는 무료 강의 내용들을 위주로 진행하였습니다.)

프론트에는 리액트, 백엔드에서는 Node.js, MongoDB를 쓸 예정이다.

$ npm i -g meteor
$ meteor create myapp
$ meteor
$ brew services start mongodb-community@4.4

local3000으로 들어가면 메테오-리액트 훅, mongoDB, api 부르기 등 여러 작업이 되어있는 브라우저를 볼 수 있다. 특히 주목할점은 client에서 mongoDB를 다룰 수가 있다. 이것을 minimongo가 도와준다.

서버에서 api 등을 다루는 것에 초점을 두자.
몽고DB활용
nosqlbooster활용
여기서 nosql booster를 활용하여 DB에 title을 바꾸면 정보가 바뀌는 것을 알 수 있다.

🚀Digital wallet 만들기

meteor run을 하면 클라이언트, 서버, 몽고DB가 같이 실행된다.
필요한 파일과 코드들을 지우고 진행한다.

코드참고, 설명 주석
✅간단한 Input UI
✅Mongo DB insert를 프론트에서 작업
✅리액트 문법
https://github.com/HYOSEUNGAN/meteor-wallet

🚀 배포 🚀

https://meteor-wallet-aiden.meteorapp.com/

Ui, css를 반응형으로는 제작안함, 간단한 기능구현만 했습니다

후기: 몽고 DB를 Insert, find 등으로 입력 후 읽어보고 렌더링 하는 작업들을 하면서 Meteor와 친해질 수 있었다. 확실히 server없이 프론트에서 작업을 할 수 있다는 큰 편의성이 있다. 하지만 모듈, 라이브러리가 한정되있거나 충돌이 있을 수도 있다는 단점도 보인다.

참조

https://guide.meteor.com/#quickstart