MEAN Stack 소개


MEAN stack은 웹개발을 위한 프로그램 세트 중의 하나로 Mongo DB, Express JS, Angular JS, Node JS 로 구성되어 있습니다. 발음은 '민 스택'이라고 읽으시면 됩니다.

네가지 구성 모두 오픈소스 프로젝트로 무료로 사용가능하며, 프로그램 사용자 언어가 javascript라는 특징이 있습니다.

이전에는 javascript가 front-end에서만 사용할 수 있었으며 back-end는 Java, C++(.NET) 등의 언어로 작업했어야 했지만 back-end용 javascript 언어가나오면서 front-end와 back-end를 모두 한가지 언어로 작업할 수 있게 된 것이지요.

지금 이 글을 읽고 계신 A-MEAN-blog.com 도 이 MEAN stack으로 만들어졌습니다.

각각의 구성요소를 살펴봅시다.

Node JS


위에 설명한 back-end용 javascript가 node.js입니다. 원래 javascirpt는 독립된 언어가 아니라 스크립트 언어인데요, 이 javascript를 웹브라우저에서 독립시킨 것이 node.js입니다. node.js를 설치하면 터미널프로그램(윈도우의 cmd, 맥의 terminal등)에서 node js 프로그램을 브라우저 없이 바로 실행할 수 있습니다. 하지만 javascript에서 분리시킨 언어라서 문법은 javascript와 똑같죠. 이로써 node.js를 이용하여 웹 브라우저에 의존하지 않는 프로그램을 만들 수 있게 되고 서버까지 만들 수 있게 된 것이죠.

Express JS


Express는 node.JS를 이용해 웹개발을 할 수 있게 해주는 framework입니다.

Mongo DB


몽고DB는 대표적인 NoSQL, Non Relational Database 입니다.

고전적인 테이블, 행, 열의 개념이 없고, 하나의 데이터는 document라고 부르며, 이 document의 모움을 collection이라고 부릅니다. 또한 모든 document들은 JSON형식으로 되어 있고 Javascript의 object와 마찬가지로 고정된 형식이 없으며 항목의 추가 삭제가 자유롭습니다. 데이터의 조작은 SQL대신 Javascript로 할 수 있습니다.

문장, 이미지데이터(base64) 등 길이가 길고 일정하지 않은 데이터들을 저장하고 검색하는데 적합한 DB입니다.

Angular JS


Angular JS는 SPA(Single Page Application)을 만드는 front-endframework입니다. Javascript로 되어 있긴 한데, Angular함수들의 사용 방식은 처음 보면 익숙하지 않아서 어렵게 느껴질 수도 있습니다.

*아래는 2017년 추가된 내용입니다

Angular


2016년 말에 Angular가 공식적으로 릴리즈되었습니다. Angular는 AngularJS의 후속판이지만 거의 새로 만든 수준이기 때문에 아예 이름을 바꾸었습니다. AngularJS와 확실히 구별하기 위해 Angular2라고도 불립니다. 여전히 Javascript를 쓸 수도 있지만 Type Script라는 언어를 일반적으로 쓰게 됩니다. A-MEAN-Blog.com도 AngularJS 강의를 준비하고 있었으나 Angular가 릴리즈됨에 따라 Angular 강의로 바꾸게 되었습니다.

댓글

I
Ian H 2016.09.16
안녕하세요 A MEAN Blog의 운영자 Ian입니다.  강좌 중에 질문이나 지적, 응원, 건의 사항등 있으시면 답글로 남겨주세요^^ 모두 화이팅!
강민혁 2016.09.29
16/9/29 시작합니당!!!
I
Ian H 2016.10.02
@강민혁,
반갑습니다^^
비니 2016.10.10
여기서도 좋은 강의 기대하겠습니다. 미리 감사합니다.~~
I
Ian H 2016.10.12
@비니,
반갑습니다^^ 아직 많이 부족하지만 저도 열심히 하겠습니다.
오구 2016.10.11
20161011 공부해보겟습니다!
I
Ian H 2016.10.12
@오구,
반갑습니다^^ 잘 안되시는 부분 있으시면 질문남겨 주세요
B
Byungwook Simon Kim 2016.11.30
따라 배우기에 좋은 컨텐츠가 있는지 찾고 있었는데 하... 감사합니다 ㅋㅋㅋ 한 번 잘 따라해볼께요~
I
Ian H 2016.12.02
@Byungwook Simon Kim,
반갑습니다^^
박지윤 2016.12.02
와..진짜 설명 깔끔하네요!!  다따라해봐야겠어요~
I
Ian H 2016.12.02
@박지윤,
화이팅^^
고명국 2016.12.12
내용 감사합니다. 화이팅!!!
I
Ian H 2016.12.28
@고명국,
화이팅^^!
애드벌 2016.12.23
마침 NODE에 관한 튜토리얼을 찾고 있었는데, 강좌 감사합니다~
I
Ian H 2016.12.28
@애드벌,
도움이 되었으면 좋겠습니다!
박경호 2016.12.28
MEAN STACK 배워보고싶어서 왔습니다! 열심히 배워볼게요!
I
Ian H 2017.01.04
@박경호,
반갑습니다. 화이팅!
블랙죠 2017.01.09
블로그 강좌보고 열심히 하다가 이곳으로 왔습니다. 다시 차근 차근 배워 가도록 하겠습니다. 참 네이버 쪽지로 글을 드렸는데요.. 확인 좀 부탁 드리겠습니다. ^^
J
Jason 2017.01.23
Angular JS관심있어서 넘어왔는데, 지것 저것 잘 둘러보겠습니다 ㅎㅎ
I
Ian H 2017.02.17
@Jason,
아직 Angular 강의는 없다는게 함정이죠 ㅋㅋ Angular 2가 나와버리는 바람에.. 지금 이 시점에 Angular 1강의를 하는 것이 의미가 있나 싶고.. Angular 2는 아직 못배웠고...
권슬기 2017.01.25
이런 블로그가 있다니 MEAN 스택을 공부하고싶어서 서핑하다가 이런 좋은 곳을 발견했네요 감사히 보겠습니다
I
Ian H 2017.02.17
@권슬기,
반갑습니다. 화이팅^^
김민수 2017.03.03
이 블로그도 MEAN 스택인가요??
I
Ian H 2017.04.04
@김민수,
이 블로그도 MEAN 스택으로 만들어져 있습니다!
z
zzolain 2017.07.10
초보자도 이해할 수 있도록 쉽게 쓰여진 강의를 찾고 있었는데, 드디어 찾았네요. 소중한 강의 고맙습니다. 
I
Ian H 2017.07.10
@zzolain,
반갑습니다 도움이 되면 좋겠습니다^^
보들보들 2017.10.15
2017/10/15 시작합니다! 좋은 강의 정말 감사드립니다!!
I
Ian H 2017.10.15
@보들보들,
반갑습니다^^ 화이팅!
코조스 2017.10.22
기대되네요...열심히 해볼렵니다...감사합니다.
I
Ian H 2017.10.24
@코조스,
반갑습니다. 화이팅!
J
Jongyo Park 2017.11.08
2017/11/08 시작합니다. 열심히 만드신 강의 감사히 하나하나 차근차근 읽겠습니다.
I
Ian H 2017.11.08
@Jongyo Park,
반갑습니다. 화이팅^^
편의점알바1호 2017.12.08
감사합니다!! ㅎㅎㅎ 완전 완성도 높은 블로그라서 저같은 초보한테 너무 좋습니다 ㅎㅎ
I
Ian H 2017.12.08
@편의점알바1호,
반갑습니다^^
쵸비 2017.12.13
설명이 쉽게 되있어서 읽기 너무 편했습니다 감사합니다~^^
I
Ian H 2017.12.13
@쵸비,
감사합니다^^ 
H
Hyeseon Maeng 2018.01.09
설명을 너무 잘해주셔서 많은 도움이 되네요. 계속 읽어보려 합니다. 감사합니다!
I
Ian H 2018.01.09
@Hyeseon Maeng,
반갑습니다. 화이팅^^
쮸리맨 2018.02.12
angular2 에서 막히네요  공부할려니깐 버전도5까지나왔고 새로운거투성이고 mean 에서 a만 멀리 떨어진느낌을 받네요 ㅠㅠ mongo node express로 백엔드만들고 프론트만 다른 프레임 워크 써서 만들어도 상관없을까요? angular보다 다른게 좋다는사람이 많아서 ㅠ 
I
Ian H 2018.02.13
@쮸리맨,
안녕하세요~ Angular.js와 구별하기 위해 카테고리 이름은 Angular 2 이지만 강의 내용은 Angular 5까지 유효합니다!
그리고 MEN으로 REST API를 만들고 react라든가 vue라든가 다른 front end 프레임워크를 써도 됩니다^^
반대로 어떠한 방식으로든 REST API를 만들면 Angular를 써서 front end만 구성하실 수도 있습니다.
동통오 2018.05.21
MEAN stack 이란  apm   apche+ php +mysql 처럼 트렌드로 이해하면 될까요?  혹시 xapm 처럼 통합 설치 프로그램은 따로 있는지요?  시스템은 우분투:
I
Ian H 2018.05.21
@동통오,
맞습니다. stack이란 개발프로그램의 모움입니다. 통합설치프로그램은 없지만, 설치할 프로그램이 node.js랑 mongo DB밖에 없습니다(텍스트 에디터는 자신이 원하는 걸로 사용). 이 강좌에서는 온라인 mongo DB를 사용하기 때문에 node.js를 설치하시면 됩니다. 나머지 express나 angular 등등은 라이브러리로 node.js 명령어(정확히는 npm 명령어)를 통해 설치됩니다.
김진성 2018.08.07
저...........브라우저가 뭐예요???????????
I
Ian H 2018.08.07
@김진성,
인터넷 익스플로러, 크롬, 파이어폭스 같은 인터넷 서핑 프로그램이요
김강한 2018.09.04
원래 모바일쪽 프로그래밍을 하던 사람입니다. 웹 개발 관련 회사 면접을 본 후 이 블로그를 통해 공부 시작하려합니다. 글 올려 주셔서 감사합니다! 2018.9.4 시작합니다!
I
Ian H 2018.09.04
@김강한,
반갑습니다. 화이팅^^!
박수진 2018.09.15
대학교 다닐 때 여기서 본 강의로 공부를 했었는데 지금은 자바웹 개발자가 되어있네요. 다시 공부하러 들렀습니다. 항상 감사합니다!
I
Ian H 2018.09.17
@박수진,
와.. 졸업하시고 바로 취업되신거에요? 부럽고 축하드려요^^
김인수 2018.10.09
안녕하세요 맨파워코리아 헤드헌팅 본부 김인수입니다. 혹시 주변에 nodeJS 사용경력 5년이상이고 나이는 80년생이하신분 추천해 주실만한 사람은 없는지요? 포지션은 백엔드개발(NodeJS)이며 블럭체인 최고 회사입니다. 연봉은 1억~2억 가능하시고 연봉 및 처우조건은 아주 좋습니다.  제메일 주소로 답변 부탁 드립니다. 감사합니다. (김인수, [email protected])
하하 2018.10.19
안녕하세요 올려주신자료 너무 잘보고 있습니다! 혹시 앵큘러2로의 게시판구축에 대해서도 포스팅 하셨는지요? 제가 찾은바로는 앵귤러js 로만 있는것 같아서요.. 그리고 앵귤러가 릴리즈되었다면 mean에서의 의미도도 앵귤러2로 생각해야 할까요? 현재 노드와 앵귤러를사용해서 계시판을 만들어 볼려고 하는데 AngularJS 와 Angular2 중 어느것을 써야할지 고민이 됩니다.  감사합니다!
I
Ian H 2018.10.19
@하하,
안녕하세요, 제 블로그에는 Angular없이 MongoDB, Express, Node js로만 게시판을 만드는 강의와, MongoDB, Express, Node js, Angular로 사이트의 기본적인 기능(로그인, 회원가입 등)을 만드는 강의가 있고, AngularJS에 대한 강의는 없습니다. Angular로 게시판을 만드는 강의는 아직 없지만, 위 두가지를 활용하면 충분히 만들 수 있습니다. Angular 게시판 강의는 나중에 추가할게요 ㅠㅠ
지금은 MEAN스택이라고 하면 일단 Angular JS가 아닌 Angular를 뜻합니다. 요즘은 특별히 Angular JS를 써야 할 이유가 없다면 Angular를 사용하시면 됩니다!
댓글쓰기

이 글에 댓글을 다시려면 SNS 계정으로 로그인하세요. 자세히 알아보기

UP