MEAN Stack 강의 소개 및 이용법

인터넷에는 정말 방대한 양의 코딩 자료가 있습니다. 코딩을 하다가 막히는 부분이 있을 때 google에 영문으로 질문하면 왠만하면 다 답이 나옵니다. 하지만 질문에 해당하는 코드를 부분적으로 제공하는 경우가 대부분이고, 해당 코드를 내 프로젝트에 적용하려하면 dependency(관련 라이브러리가 설치되어 있어야만 해당 코드가 작동하는 경우) 문제, 프로젝트 세팅 방법 등의 문제로 코드를 적용하기 함든 경우가 많았습니다.

그래서 저는 실행가능한 전체 소스코드를 함께 제공하는 강의 사이트를 만들자고 생각하게 되었고 그 결과 탄생한 것이 A-MEAN-Blog.com입니다. 즉 실행가능한 소스코드의 제공이 이 사이트의 핵심입니다.

MEAN Stack 강의의 목표는 MEAN stack을 사용해서 웹사이트를 제작하는 법을 익히는 것이며 강의 대상은 1. JavaScript, HTML, CSS를 이용하여 아주 간단한 사이트를 제작할 수 있는 분들, 2. 프로그래밍의 기본은 알고 있지만 웹프로그래밍은 처음이신 분들로 하고 있습니다.

** JavaScript를 공부하고 싶으시다면 이 블로그의 자바스크립트로 프로그래밍 입문 강의를 참고해 주세요!

강의 활용방법

게시물들은 소스코드가 포함된 실습용 게시물과, 소스코드가 포함되지 않은 이론 게시물로 나누어집니다. 소스코드가 포함된 게시물은 아래와 같이 소스코드를 다운받을 수 있는 명령어가 게시물에 포함되어 있습니다.


회색박스 부분이 명령어들이며 이 명령어들을 사용하기 위해서는 NPM, Git, Atom editor등이 설치되어 있어야 합니다. 각각 프로그램의 설치방법은 다음 항목(마지막에 링크를 달아 두겠습니다)에서 알아보겠습니다.

여러 줄의 명령어($하나당 한 명령어)지만 한번에 드래그해서 복사한 후 터미널에 붙여넣기 하면 자동으로 한 줄씩 순서대로 실행이 됩니다. 실행하면 소스코드가 다운로드/업데이트 되어지고 Atom editor에 아래와 같이 해당 강의에서 바뀐 파일 및 코드가 표시됩니다.


왼쪽 파일트리에서는 파일 색깔로, 오른쪽의 코드 화면에는 번호 옆에 색깔로 표시됩니다. 회색은 변화가 없는 부분, 주황색은 바뀐 부분, 초록색은 새로 생긴 부분입니다.

이처럼 소스코드가 있는 강의는 소스코드를 반드시 먼저 받은 다음 그 코드를 보면서 강의를 진행하시기 바랍니다. 이 소스코드는 강의 이해용으로만 사용하고 이 소스코드와는 별개로 직접 코드를 입력하여 사이트를 제작해 주세요.

A-MEAM-Blog.com 사이트는 모바일/테블릿에서도 기기의 사이즈에 맞게 화면이 출력됩니다. 랩탑/데스크탑으로 소스코드를 실행시키고 모바일/테블릿 기기를 이용하여 강의 내용을 확인하는 것도 좋은 방법입니다.


- 이어지는 항목으로 이동: MEAN Stack/개발 환경 구축

댓글

g
genie 2017.11.19
이 블로그를 만들어주셔서 감사합니다! 열심히 따라가며 공부해보겠습니다. 
I
Ian H 2017.11.20
@genie,
반갑습니다. 질문있으시면 답글로 남겨주세요^^
D
Diane Seo 2017.11.29
블로거님 정말 최고 짱!! 멋지고 사랑스러운 블로그에요~ 앞으로 자주 들를게요!!
I
Ian H 2017.11.30
@Diane Seo,
반갑습니다. 사랑스럽다는 칭찬은 처음 들어보네요^^;  감사합니다
차누누 2019.12.31
node.js 공부하고싶은데 교재가 맘에들지 않았는데, 이렇게 좋은 블로그가 있는줄을 몰랐네요 ㅎ 더 나은 선생님을 위하여 애드블럭끄고 자주 실수로 배너도 클릭해 보도록 하겠습니다! 감사합니다 ㅋㅋ
I
Ian H 2019.12.31
@차누누,
반갑습니다^^ VIP 방문객으로 모시겠습니다 ㅋㅋ 질문있으시면 답글 남겨주세요. 화이팅!
댓글쓰기

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

UP