안녕하세요, 우리동네코딩 스튜디오에 오신 것을 환영합니다!
우리동네코딩 스튜디오는 카네기 멜론, 워싱턴, 토론토, 워터루 등 북미의 주요 대학에서 컴퓨터공학을 전공하고, Google, Microsoft, Meta 등 글로벌 IT 기업에서 실무 경험을 쌓은 개발자들이 함께 만든 교육 그룹입니다.
처음에는 미국과 캐나다의 컴퓨터공학 전공자들끼리 함께 공부하며 성장하고자 만든 스터디 모임에서 시작되었습니다. 각기 다른 대학, 다른 시간대에 있었지만 함께 문제를 해결하고 서로에게 배운 그 시간은 매우 특별했고, 자연스럽게 이런 생각이 들었습니다.
“우리가 공부하던 이 방식, 그대로 다른 사람에게도 전하면 어떨까?”
그 물음이 바로 우리동네코딩 스튜디오의 출발점이었습니다.
현재는 약 30명의 현직 개발자와 컴퓨터공학 전공 대학생들이 각자의 전문 분야를 맡아, 입문부터 실전까지 아우르는 커리큘럼을 직접 설계하고 강의합니다. 단순한 지식 전달을 넘어, 진짜 개발자의 시선으로 배우고 함께 성장할 수 있는 환경을 제공합니다.
“진짜 개발자는, 진짜 개발자에게 배워야 합니다.”
저희는 웹 개발의 전 과정을 처음부터 끝까지 체계적으로 다루되, 이론에 머무르지 않고 실습과 실전 중심의 피드백을 통해 실력을 키워드립니다.
수강생 한 사람, 한 사람의 성장을 함께 고민하고 이끌어가는 것이 우리의 철학입니다.
🎯 우리의 철학은 분명합니다.
"진정한 배움은 실천에서 오고, 성장은 함께할 때 완성된다."
개발을 처음 시작하는 입문자부터, 실무 능력을 키우고 싶은 취업 준비생, 진로를 탐색 중인 청소년까지.
우리동네코딩 스튜디오는 모두의 출발점이자, 함께 걷는 든든한 동반자가 되고자 합니다.
이제, 혼자 고민하지 마세요.
우리동네코딩 스튜디오가 여러분의 성장을 함께하겠습니다.
Welcome to Neighborhood Coding Studio!
Neighborhood Coding Studio was founded by a team of developers who studied computer science at top North American universities such as Carnegie Mellon, the University of Washington, the University of Toronto, and the University of Waterloo, and went on to gain hands-on experience at global tech companies like Google, Microsoft, and Meta.
It all began as a study group formed by computer science students across the U.S. and Canada, created to grow together by sharing knowledge, solving problems, and learning from one another.
Though we were attending different schools in different time zones, the experience was so meaningful that it led us to one simple thought:
“What if we shared this way of learning with others?”
That thought became the foundation of Neighborhood Coding Studio.
Today, we are a team of around 30 active developers and computer science students, each taking responsibility for their area of expertise—designing and delivering a curriculum that spans from foundational knowledge to real-world development.
We’re not just here to teach—we’re here to help you see through the lens of real developers and grow together.
“To become a real developer, you must learn from real developers.”
Our courses take you through the entire web development journey—from start to finish—focused on hands-on practice, real-world projects, and practical feedback.
We care deeply about each learner’s growth and are committed to supporting your path every step of the way.
🎯 Our philosophy is simple but powerful:
"True learning comes from doing, and true growth happens together."
Whether you're just getting started, preparing for your first job, or exploring your future in tech,
Neighborhood Coding Studio is here to be your launchpad—and your trusted companion on the journey.
You don’t have to do it alone.
Let Neighborhood Coding Studio walk with you toward your future in development.
강의
수강평
- 구조 탐색과 조작의 모든 것 - [DOM 완전 정복 Part 1]
- 이벤트부터 SPA까지, 상호작용 웹의 필수 엔진 - [DOM 완전 정복 Part 2]
- 구조 탐색과 조작의 모든 것 - [DOM 완전 정복 Part 1]
- 제대로 배우는 HTML + CSS: 입문부터 실전까지 완벽 정복 Part2 - [중급편]
게시글
질문&답변
json 대신 로그인, 회원가입 일때 db 연결 및 data 사용하려면 어떻게 하나요?
안녕하세요 eju님 🙂JSON 파일 대신 데이터베이스(DB)를 사용해 로그인과 회원가입 기능을 만들고 싶으시다면, 전체적인 그림을 이렇게 이해하시면 됩니다.우선 JSON 파일은 데이터를 “그때그때 파일로 직접 저장하는 방식”이에요. 간단해서 배우기에는 좋지만, 사용자가 많아지거나 여러 요청이 동시에 들어오면 금방 한계가 생깁니다. 반면 DB(데이터베이스)는 수많은 데이터를 빠르고 안정적으로 보관하고 꺼내 쓸 수 있는 전용 저장소예요. 쉽게 말해, “데이터를 안전하게 관리해주는 똑똑한 금고”라고 생각하시면 됩니다.Node.js와 Express 환경에서 자주 쓰는 DB에는 세 가지 대표적인 종류가 있습니다.먼저 MySQL과 PostgreSQL은 표(테이블) 형태로 데이터를 저장하는 관계형 데이터베이스입니다. 회원 정보, 결제 내역, 주문 기록처럼 구조가 정해진 데이터를 다룰 때 강력하고 안정적이에요.반면 MongoDB는 NoSQL 데이터베이스로, JSON처럼 생긴 문서(document) 단위로 데이터를 저장합니다. 구조가 자유롭고 변경이 잦은 서비스, 예를 들어 SNS, 게시판, 로그 기록 에서 특히 자주 사용됩니다. 실무에서는 여전히 PostgreSQL이나 MySQL이 가장 많이 쓰이고, 빠르게 기능을 만들어야 하는 스타트업이나 학습용 프로젝트에서는 MongoDB도 인기가 많습니다.Node.js + Express에서는 이런 DB와 연결하기 위해 중간 도구(라이브러리)를 사용합니다.PostgreSQL이나 MySQL은 Prisma나 Sequelize, MongoDB는 Mongoose를 가장 많이 써요.이 도구들이 “DB에 데이터 넣기 / 꺼내기”를 자바스크립트 코드 몇 줄로 간단하게 바꿔 줍니다.간단히 회원가입을 예로 들면, 사용자가 이름·이메일·비밀번호를 입력했을 때 서버는 다음 순서로 동작합니다.입력값이 비어 있지 않은지, 이메일 형식이 맞는지 검사합니다.비밀번호를 bcrypt 라이브러리로 암호화(해시)합니다. 이렇게 하면 실제 비밀번호가 노출되지 않고도 로그인 검증이 가능합니다.암호화된 비밀번호와 함께 DB에 안전하게 저장합니다.로그인 과정은 반대로,사용자가 입력한 이메일을 DB에서 찾아보고,저장된 암호화된 비밀번호와 입력된 비밀번호를 bcrypt.compare()로 비교합니다.두 값이 일치하면 로그인 성공으로 처리합니다.로그인이 성공하면 서버는 세션/쿠키 방식이나 JWT 토큰을 사용해 로그인 상태를 유지합니다. 세션은 “서버가 로그인표를 들고 있는 방식”이고, JWT는 “서버가 서명된 출입증을 만들어 클라이언트가 직접 들고 있는 방식”이에요.보안은 여기서 매우 중요합니다.1. 비밀번호는 절대로 원문 그대로 저장하지 않고 반드시 해시 형태로 저장해야 합니다.2. DB 주소와 계정 정보는 코드에 직접 쓰지 말고 .env 파일에 따로 숨겨야 합니다.3. 입력값을 꼼꼼히 검사해서 비정상적인 데이터(빈칸, 이상한 형식 등)는 바로 거절해야 합니다.이 세 가지만 지켜도, JSON 파일 대신 DB를 사용해도 훨씬 안전하고, 실제 서비스에 가까운 구조를 만들 수 있습니다.마지막으로, 실무에서는 PostgreSQL이나 MySQL이 표준으로 가장 널리 쓰이고,MongoDB는 빠르게 바뀌는 데이터나 JSON 구조의 서비스에 유리합니다.처음 공부하실 때는 MongoDB가 이해하기 쉬워서 입문용으로 좋고,나중에 회사나 프로젝트 단위로는 PostgreSQL을 연습해두시면 실무에 훨씬 도움이 됩니다.이 부분은 앞으로 제가 준비 중인 Node.js + Express 실전 강의에서 다룰 예정입니다.JSON 저장에서 DB 연결로 넘어가는 과정, Prisma·Mongoose 사용법, 비밀번호 암호화와 로그인 세션 관리까지 전부 하나씩 보여드릴 계획이에요. 현재 교재와 함께 실습 중심 강의로 준비 중이며, 가능한 한 빠른 시일 내에 출시하겠습니다.감사합니다.
- 0
- 1
- 7
질문&답변
보안에 취약 한가요?
안녕하세요 eju님 🙂,어떤 상황에서의 보안을 말씀하시는지, 그리고 서버 보안, 데이터 전송 보안, 사용자 인증 보안 등 어떤 종류의 보안을 의미하시는지 구체적으로 알려주시면 보다 정확하게 안내드릴 수 있을 것 같습니다. 감사합니다.
- 0
- 1
- 9
질문&답변
테스트시 포스트맨 외 테스트 할수 있는 방법이 있을까요?
안녕하세요 eju님 🙂Postman은 이미 전 세계 개발자들이 표준처럼 사용하는 매우 좋은 테스트 도구입니다. 직관적이고 안정적이며, 팀 단위로도 협업하기 쉬워서 지금도 실무에서 가장 많이 사용됩니다. 그래서 새로운 도구를 찾기보다는, Postman을 기본으로 꾸준히 쓰는 것 자체가 좋은 선택이에요. 다만 상황에 따라 “Postman이 없어도 테스트할 수 있는 방법”이 여러 가지 있으니, 그 배경을 함께 설명드릴게요.먼저, Postman과 가장 비슷한 대체 도구는 Insomnia입니다.Insomnia는 인터페이스가 조금 더 단순하고 가볍기 때문에, 처음 배우는 분들이 부담 없이 쓸 수 있습니다. REST API뿐 아니라 GraphQL이나 gRPC 같은 최신 기술도 지원하기 때문에, 나중에 프로젝트 규모가 커져도 그대로 사용 가능합니다. Postman이 조금 복잡하거나 무겁게 느껴질 때 좋은 선택입니다.다음은 브라우저나 터미널(명령줄)을 이용하는 방법입니다.간단한 테스트라면 브라우저 주소창에 API 주소를 직접 입력해도 됩니다. 예를 들어 http://localhost:3000/api/users를 입력하면 서버가 주는 응답을 바로 볼 수 있습니다. 조금 더 기술적으로는 curl이라는 명령어 도구를 사용할 수도 있습니다. 이건 대부분의 컴퓨터에 기본으로 들어 있어서, 별다른 설치 없이 터미널에 한 줄만 입력해도 서버의 응답을 확인할 수 있습니다. 예를 들어 “이 API가 실제로 잘 동작하는지”나 “서버가 응답을 보내는 데 걸리는 시간”을 간단히 점검할 때 좋습니다.좀 더 체계적으로, 코드로 테스트를 자동화하는 방식도 있습니다.Node.js와 Express.js 환경에서는 Jest, Mocha, Supertest 같은 도구를 많이 씁니다.이 방법은 사람이 직접 클릭하지 않고, “이 API를 호출했을 때 응답이 이런 모양이면 성공이다”를 미리 코드로 적어두는 방식이에요. 버튼 한 번으로 전체 API를 동시에 확인할 수 있어서, 개발이 어느 정도 익숙해졌을 때 도입하면 좋습니다. 예를 들어 로그인, 회원가입, 상품목록 API 같은 걸 한꺼번에 돌려서 “어디서 실패했는지”를 자동으로 알려줍니다. 기업 환경에서도 이런 자동화 테스트는 배포 전에 거의 필수로 사용됩니다.또 하나 기억하시면 좋은 건 서버 상태를 주기적으로 자동 검사해 주는 모니터링 도구입니다.Postman도 “Monitor” 기능을 자체적으로 제공합니다. 이걸 설정해 두면, 예를 들어 “10분마다 /api/health 엔드포인트를 검사해서 서버가 살아 있는지 확인” 같은 작업을 자동으로 해 줍니다.만약 서버가 멈추면 바로 이메일이나 슬랙으로 알려줘서 빠르게 대응할 수 있습니다.이외에도 Hoppscotch, Paw, K6, Newman 같은 모니터링·테스트 도구들도 있습니다.특히 Newman은 Postman에서 만든 테스트 스크립트를 그대로 가져와서 터미널에서 자동으로 돌릴 수 있게 해 주기 때문에, Postman을 그대로 확장해서 쓰는 느낌에 가깝습니다.정리하면, Postman은 지금도 충분히 훌륭한 도구이고 그대로 사용하셔도 전혀 문제 없습니다.다만 필요에 따라 다음과 같은 선택지를 알고 계시면 좋습니다.Insomnia — Postman보다 가볍고 단순한 대체 도구브라우저 주소창 또는 curl — 가장 빠르고 설치 없이 가능한 간단 테스트Jest, Supertest, Mocha — 코드로 자동 테스트를 돌릴 수 있는 실무형 방식K6, Hoppscotch, Newman, Postman Monitor — 서버를 주기적으로 자동 검사하는 방식결국 Postman은 기본이자 중심 도구입니다.그대로 사용하면서 위의 방법들을 “보조 수단”으로 조금씩 익히면, 테스트 효율이 훨씬 높아집니다.즉, “Postman을 버리는 게 아니라, Postman을 중심으로 확장한다”는 생각으로 접근하시면 가장 좋습니다.감사합니다.
- 1
- 1
- 8
질문&답변
404, 500 에러 처리 외에 특정 개발 구문에서 에러 발생했을때 찾는 방법이 있을까요?
안녕하세요 eju님 🙂,404나 500 같은 에러는 “페이지를 찾을 수 없음”, “서버 내부 문제”처럼 이미 Express가 기본적으로 처리해 주는 에러입니다. 하지만 실제 개발 중에는 “특정 코드 줄에서 갑자기 터지는 에러”를 찾아야 하는 경우가 훨씬 많습니다. 이런 상황을 쉽게 찾는 실무용 방법을 아주 기초부터 설명드릴게요.가장 먼저 알아두실 건 “로그(log)”입니다. 로그는 프로그램이 실행되면서 남기는 일기라고 생각하시면 됩니다. Node.js와 Express에서는 보통 Winston이나 Pino 같은 도구를 써서 로그를 남깁니다.이걸 켜 두면, 에러가 났을 때 “어느 파일의 몇 번째 줄에서 어떤 요청이 들어왔을 때 터졌는지”를 바로 볼 수 있습니다. 예를 들어 “/login 페이지로 요청이 들어왔는데, username이 비어 있어서 오류 발생” 같은 식으로 남죠.이 로그는 나중에 콘솔이나 파일에서 그대로 읽어볼 수 있습니다.다음은 “디버깅(debugging)”이에요.디버깅은 코드의 실행을 잠깐 멈춰서, 변수 안에 무슨 값이 들어 있는지 직접 확인하는 작업이에요.Node.js는 --inspect 모드라는 기능을 제공합니다.이걸 켜면 크롬 브라우저나 VS Code에서 프로그램을 “일시정지”하고, 특정 코드 줄을 확인하거나 변수값을 바로 볼 수 있습니다. 예를 들어 “이 if문 안이 실행되는지?” 혹은 “여기서 받은 데이터가 비어 있는지?” 같은 걸 눈으로 확인할 수 있어요. 초보 단계에서는 console.log( )로 중간중간 출력해 보는 것도 디버깅의 한 형태이지만, 나중에는 이렇게 프로그램을 멈춰서 보는 방식이 훨씬 효율적입니다.세 번째는 “에러 추적 서비스”입니다.이건 조금 더 자동화된 방법인데, Sentry, Bugsnag, Rollbar 같은 서비스가 대표적이에요.이 도구들을 Express에 한 줄만 연결해 두면, 에러가 발생할 때마다 자동으로 서버에서 정보를 모아서 웹사이트로 보내줍니다. 그럼 나중에 브라우저에서 “언제, 어떤 요청에서, 무슨 이유로 에러가 났는지”를 한눈에 볼 수 있고, 에러가 반복되면 그 빈도나 경향까지 분석해 줍니다. 즉, 직접 콘솔을 보지 않아도 자동으로 알려주는 “에러 알림 시스템”이라고 생각하시면 됩니다.그리고 네 번째로는 “입력값 검증(validation)”입니다.사실 많은 에러는 서버 로직 자체보다, 사용자가 잘못된 값을 보내서 생깁니다.이걸 미리 잡아주는 방법이 “요청 검증 라이브러리”입니다.대표적으로 Joi, Celebrate, Zod 같은 도구가 있어요.예를 들어 “숫자여야 하는데 문자열이 들어오면 아예 실행하지 않고 400 오류로 깔끔하게 돌려주는” 식이죠. `이렇게 하면 “내 코드 내부 버그”와 “입력 잘못으로 인한 오류”를 구분하기 쉬워집니다.마지막으로 “에러 핸들러”라는 걸 꼭 하나 만들어 두시면 좋습니다.Express는 코드 어디에서든 에러가 생기면 마지막에 있는 에러 처리 구문으로 모아줍니다.그곳에서 에러 메시지와 스택(어느 파일 몇 줄에서 났는지)을 출력하거나, 사용자에게 보기 좋은 메시지를 보낼 수 있습니다. 이걸 써두면 갑작스러운 오류가 발생해도 프로그램 전체가 멈추지 않고, 원인을 안전하게 기록할 수 있습니다.정리하자면,로그 도구로 일기처럼 실행 상황을 남기고,디버깅 모드로 코드 중간을 직접 들여다보며,Sentry 같은 에러 추적 서비스로 자동 기록을 받고,입력 검증 라이브러리로 잘못된 요청을 미리 막고,에러 핸들러로 예외를 한곳에서 관리하면,“특정 코드에서 어떤 이유로 에러가 발생했는지”를 쉽게 찾아낼 수 있습니다.지금은 복잡해 보여도, 사실 각각의 도구는 “로그를 잘 남기고, 에러를 보기 쉽게 만들자”라는 같은 원리를 공유합니다. 처음에는 console.log로 시작하시고, 익숙해지면 Sentry나 Winston처럼 조금씩 자동화된 도구로 확장하시면 됩니다.감사합니다.
- 0
- 1
- 10
질문&답변
ejs 와 어떤 개발언어로 조합해서 사용했을때 성능이 좋을까요?
안녕하세요 eju님 🙂,EJS는 Embedded JavaScript Templates의 약자로, HTML 안에 자바스크립트 코드를 끼워 넣어 동적으로 완성된 웹페이지를 만드는 템플릿 엔진입니다. 예를 들어 처럼 작성하면, EJS가 해당 구문 안의 자바스크립트 표현식을 평가해 실제 값으로 치환한 HTML을 만들어 줍니다. 이 과정은 브라우저가 아닌 서버에서 이루어지며, Node.js 환경에서 실행됩니다. Node.js는 브라우저 외부에서도 자바스크립트를 실행할 수 있도록 만든 런타임 환경으로, 구글 크롬의 V8 엔진을 그대로 사용합니다. 따라서 EJS가 생성한 자바스크립트 코드는 Node.js에서 별도의 변환 과정 없이 바로 실행됩니다.EJS는 단순히 HTML 문자열을 출력하는 도구가 아니라, 내부적으로 템플릿을 한 번 파싱하여 자바스크립트 함수 형태로 변환한 뒤 실행합니다. 즉, 사람이 작성한 .ejs 파일은 내부적으로 하나의 함수로 컴파일되어 실행되는 구조를 가지고 있습니다. 이 과정은 언어 번역을 위한 트랜스파일 과정이 아니라, HTML과 자바스크립트 표현식을 결합하기 위한 단순한 텍스트 변환 단계입니다. 그렇기 때문에 Babel 같은 별도의 번역 도구는 필요하지 않습니다. 즉, 자바스크립트로 작성된 템플릿이 자바스크립트로 그대로 실행된다는 점에서 매우 효율적입니다.Node.js와 EJS가 자연스럽게 함께 동작하는 이유는 JSON과 자바스크립트 객체의 완전한 호환성 덕분이기도 합니다. 서버에서 res.render('profile', { name: '홍길동' })처럼 단순히 객체를 전달하면, EJS 내부에서는 그 데이터를 변환 없이 바로 사용할 수 있습니다. JSON 문법이 자바스크립트 객체 리터럴과 동일하기 때문에 별도의 직렬화나 역직렬화 과정이 필요하지 않습니다. 이런 구조 덕분에 서버에서 생성된 데이터를 템플릿으로 전달할 때 중간 단계가 생략되어 코드가 단순하고 처리 속도도 빠릅니다.Node.js의 핵심 엔진인 V8은 JIT(Just-In-Time) 컴파일러를 내장하고 있습니다. 이는 자주 실행되는 코드를 기계어 수준으로 최적화하여 실행 속도를 높이는 기술로, EJS처럼 서버에서 반복적으로 실행되는 코드에서도 성능 이점을 제공합니다. 또한 Express.js는 EJS 템플릿 렌더링을 위한 캐시 기능을 지원합니다. 한 번 컴파일된 EJS 템플릿은 메모리에 저장되어 다음 요청 시 재사용되며, 프로덕션 모드에서는 기본적으로 이 캐시가 활성화됩니다. 즉, 서비스 환경에서는 한 번 파싱된 템플릿 함수가 그대로 재사용되어 렌더링 속도가 점점 더 빨라집니다.결과적으로 EJS와 Node.js의 조합은 같은 언어 위에서 움직이므로 불필요한 변환이 없고, JSON 데이터가 자연스럽게 연결되며, V8 엔진의 최적화와 Express의 캐시 기능 덕분에 빠르고 안정적으로 동작합니다. 이런 이유로 EJS는 Node.js 환경에서 가장 자연스럽고 효율적인 템플릿 엔진 중 하나로 평가됩니다. 다만 EJS는 Node.js 전용으로 만들어진 것은 아니며, 브라우저에서도 독립적으로 실행할 수 있는 범용 자바스크립트 템플릿 엔진이라는 점을 함께 기억하셔야 합니다.또한, 다른 언어들에서도 이와 유사한 방식의 템플릿 엔진이 존재합니다. 예를 들어 Python의 Jinja2, PHP의 Twig, Ruby의 ERB(Embedded Ruby), 그리고 Java의 JSP(JavaServer Pages) 등이 그 대표적인 예입니다. 이들은 모두 “코드와 마크업을 섞어 최종 HTML을 생성하는” 구조를 가지며, 각 언어 환경에서 EJS와 동일한 역할을 수행합니다. 즉, 자바스크립트 생태계에서는 EJS가 이 역할을 맡고, Python에서는 Jinja2가, Ruby에서는 ERB가, Java에서는 JSP가 같은 기능을 담당한다고 보실 수 있습니다. 이러한 템플릿 엔진들은 모두 언어별 런타임과 긴밀히 연결되어 작동하기 때문에, EJS가 Node.js와 자연스럽게 어우러지는 것처럼 다른 언어의 템플릿 엔진들도 각자의 환경에서 최적화된 형태로 실행됩니다.감사합니다.
- 0
- 1
- 9