스터디인코딩 study in coding

누구나 할 수 있는 웹사이트 만들기

누구나 할 수 있는 웹사이트 만들기

HTML과 CSS의 기본부터 제대로

강의과정 소개

웹 프론트엔드란?

HTML과 CSS 그리고 자바스크립트를 활용하여 보여주고자 하는 것들이 웹 상에 잘 보이게끔 프로그래밍하는 것을 말합니다.

단순히 보여주기만 하는 것은 어렵지 않지만, 어디서든 최상의 모습으로 잘 보이게 하기 위해서는 웹브라우저 호환, 반응형 웹, 시맨틱 마크업 등 웹프론트엔드 주요이슈에 대한 이해가 꼭 필요합니다.

기초부터 활용까지

웹 표준에 근거하여 마크업 언어의 원리와 기본 문법을 정확히 이해합니다.

완전 기초부터 시작하여 시맨틱 마크업, float를 이용한 구조잡기와 포지셔닝, 미디어쿼리를 활용한 모바일웹과 반응형웹, CSS3을 활용한 애니메이션, 자주 사용되는 자바스크립트/jquery 함수들 활용법, 각 종 플러그인 적용, 웹 호스팅 및 배포까지 배웁니다.

강의는 이렇게 진행됩니다.

여러 명의 강사가
수업을 진행합니다.

배운 것을 제대로 이해하기 위해서는 실습이 꼭 필요한데, 한명의 강사로는 효율적인 실습 진행이 어려워 여러 명의 강사를 모셨습니다. 수업중에 어려운 것이 있으시면 언제든지 손을 드세요.

프로그래밍을 전혀 모르는
비전공자가 대상입니다.

입문자에서 웹 퍼블리셔로 첫걸음을 딛는 데 필요한 모든 내용을 담았습니다. HTML과 CSS가 무엇인지, 태그는 어떻게 사용하는지, 웹사이트가 어떻게 작동하는지부터 시작합니다.

무조건 따라하기가 아닌
알고나서 따라하기

눈앞의 결과물로 인해 착각하기 쉬운 따라하기 방식의 강의. 하나를 배우더라도 확실하게 자신의 것으로 만들어야 합니다. 어디서나 쉽게 찾고 따라할 수 있는 내용이 아닌, 현업에서 일하는 강사진의 소소한 팁들과 경험을 전달해드립니다.

웹 포트폴리오

수강생 포트폴리오
자이언트 웹사이트 리메이크

수강생 포트폴리오
월간윤종신 디자인웹

수강생 포트폴리오
휠 스크롤 디자인 웹

웹프론트엔드 강사진

함께 할 강사들

최재원

  • 현) 스터디인코딩 대표
  • 현) 유니티 전임강사
  • 전) 아이디어스 클라이언트 개발
  • 대학교 및 기타 기관 강의 출강

황완식

  • 현) 클래스에이드 대표
  • 전) 멋쟁이사자처럼 이사
  • 전) 성균관대학교 웹프론트엔드/UX 캠프 강사

송승준

  • 현) 스터디인코딩 대표
  • 현) 웹프론트 전임강사
  • 전) 주식회사 인셀럽 이사
  • 전) IMLAB 개발 연구원
  • 한국과학기술연구원 Romin, 스냅미 등 다수의 웹, 앱 서비스 제작
  • 대학교 및 기타 기관 강의 출강

김민철

  • 현) 스터디인코딩 대표
  • 현) 웹프론트 전임강사
  • 전) 유니티 강사
  • 고등학교 및 기타 기관 강의 출강
  • lawit 외 다수의 웹 서비스 제작

김제언

  • 현) Leo 클라이언트 프로그래머
  • 전) bkc R&D 재직
  • 전) 듀플렉스 기록물DB관리 재직
  • 플레이빌,청년장사꾼 등 다수의 웹, 앱 서비스 제작

김소연

  • 현) SJEdu 대표
  • 현) 양영고등학교 전공심화연구회 교사
  • 현) 유니티 강사
  • 전) 곤지암고등학교 강의 출강

수강생 리뷰

수강생 강석환님

코딩을 전혀모르는 상태에서도 너무 이해가 쉽게 잘 가르쳐주셔서 감사드립니다. 코딩초보,중수 상관없이 유익한 수업입니다. 디자인전공을 하며 포트폴리오웹사이트가 필요해 코딩수업을 듣게되었는데, 처음엔 HTML이 뭔지, CSS가 뭔지 아무 개념도 없었지만 겨우 한달여만의 시간내에 사이트 하나 뚝딱 만들어낼 실력으로 키워주셨습니다. 무엇보다 실습과정중에 너무 친절하고, 상세히 알려주셔서 수업중 궁금한것도 부담없이 물어보고 피드백 받을 수 있었습니다. 강의를 들으시려는 모든분들께 추천드립니다.


수강생 신용범님

개인적으로 이런 지식을 얻는 방법에 독학, 학원, 과외 3가지가 있다고 생각합니다. 항상 무언가를 만들어보고 싶은 마음에 독학으로 시작하지만 문제에 직면하면 얼마 못가서 포기하곤 했어요. 과외가 좋은 것은 알지만 너무 비싸서 학원에 다니기로 결심했어요. 학원에서는 제가 이해했던 이해하지 못했던 수업은 진행했고 새로운 것을 배웠어요. 맨땅에 헤딩하는 시간도 확실히 절약할 수 있었고요. 무엇보다 짧은 기간 동안 웹개발에 대한 전반적인 지식을 얻어 내가 부족한 부분이 어느 부분인지 쉽게 파악이 되었어요. 앞으로 배운 것을 100% 응용할 줄 알려면 더 연습을 해야겠지만 독학보다 확실히 시간절약은 될 것 같아요. 모르는 게 있어도 물어볼 곳이 있다는것, 같이 공부하는 사람들이 옆에 있어 동기부여가 된다는 것 이 2가지가 이 학원에서 얻은 가장 큰 장점인 것 같아요!


수강생 강세라님

처음부터 끝까지 작은 하나도 놓치지 않고 이해가 쏙쏙 되도록 짚어주셔서 좋았어요~~ 실습 내용이 실무에서 쓰이는 방식들로 이루어져 있고, 프로젝트를 완성하기 위해 필요한 깨알팁들과 유용한 스킬들 덕분에 포폴을 무리없이 완성할 수 있었어요ㅎㅎ
처음으로 웹 공부를 하면서 되게 무지했는데ㅎㅎㅎ 물어보지 않아도 찾아오셔서 짚어주시는 강사님들 덕분에 웹에 흥미를 갖게 되었고 앞으로는 혼자서도 공부해나갈 수 있을 것 같습니다ㅎㅎ 그동안 고생 많으셨어요!

수강생 이호준님

일반 학원을 다니다가 인코딩 수업을 들었습니다. 제 소개를 하자면, 웹 디자인 쪽 업계에서 1년 정도 디자인 업무를 맡아왔습니다. 회사에서 퍼블리싱 능력을 요구하기도 했고, 개인적으로 배워보고 싶어서 공부하겠다 결심했구요 웹분야에서 일하다보니 주변에 전공자들이 많아서 이런저런 조언을 듣다가 결국엔 포트폴리오 하나 정도는 꼭 필요하다는 말을 듣고 회사 근처 컴퓨터 학원으로 3개월 과정을 신청했어요. (회사 사정으로 환급도 못 받고.. 적지 않은 돈을 투자해서 학원 다녔어요)

보름정도 학원을 다니다보니 뭔가 이상하다는게 느껴졌어요 사무실에서 책장너머로 웹프론트가 어떤 식으로 진행되는지 봐온게 있는데 정해져있는 레이아웃을 그냥 따라만들어보라는데, 왜 저게 저렇게 쓰이는건지에 대한 설명이 없으니 이거 배워봤자 정작 내 것을 만들어볼때 활용할수가 없을것 같았어요 궁금한게 있어도 강사님께 따로 질문할만한 분위기도 아니여서 딱히 물어볼 곳도 없고.. 한 달 정도 다니다가 일부 환불받고 그만뒀어요

그 후로 그냥저냥 회사 동료들한테 모르는거 물어보면서 혼자 공부하고 있다가 페이스북에서 인코딩 광고를 봤어요 혼자 공부하는게 지치기도 했고, 솔직히 싼 맛에 별 기대없이 신청했습니다 근데 인코딩은 느낌이 좀 달랐어요. 원래 두 분의 강사님이 들어와서 한 분은 앞에서 강의하고 한 분은 돌아다니면서 봐주시는데 거의 대부분의 수업을 대표님?도 같이 들어와서, 정말 열심히 한명한명 봐주시더라구요 뭔가 너무 열심히 하시니까 왠지 괜히 죄송스러울정도로...ㅋㅋㅋ제가 이상한건가요

암튼 오늘 수업내용 중에서 이해가 안되는 부분은 없는지 물어보지 않아도 강사님들과 대표님이 먼저 와서 캐치해줬어요 만들고 싶은 웹이 뭔지 들어주시고, 방향을 제시해줘요 강의를 들었다기보다는 개인과외를 한 느낌?

짧은 기간동안 이것저것 많은 것들을 배운다기보다는 핵심적인 것들을 혼자서도 여러 방향으로 활용할 수 있을 정도로 제대로 가르쳐주시는게 좋았습니다 페이스북에서 인코딩 글들 보이면 열심히 퍼나를게요~! 인코딩 화이팅!!!!!!!!!

수강생 윤영진님

6주간의 웹 수업을 듣고 프로그래밍에 대한 자신감이 생겼습니다. 항상 웹페이지를 만드는 데에 있어서 방대한 프로그래밍 지식이 필요한 줄 알았는데 그런게 아니고 누구나! 쉽게 들을 수 있는 강의였던 것 같습니다. 사람마다 강의를 평가하는 기준이 다를 텐데요, 저와 같은 비전공자를 위해 세심하고 쉽게 가르켜주시는 송승준 강사님의 강의 스타일이 저는 너무나 맘에 들었습니다. 강의를 신청하기 전에 웹 프론트 엔드는 인코딩에서 배우는 것이 좋다는 친구의 추천을 듣고 배우는데, 저는 프로그래밍에 익숙하지 않아 못따라가면 어쩌지...라는 걱정이 앞섰습니다. 하지만 첫 강의를 듣고 그건 기우였다는 걸 알았죠!ㅎㅎ 오히려 저같은 아무것도 모르는 비전공자들에게 꼭 맞는 맞춤강의였습니다. 저는 인터넷으로 이것저것 온라인 강의도 들어보고 블로그도 뒤져가며 혼자 하려 해보았지만, 굉장히 힘들더라구요. 웹 제작 강의는 역시 현장강의가 좋은 것 같습니다. 제가 필요한 부분도 질문할 수 있어서 너무 좋았구요, 실습을 통해 배운걸 복습하는 시간 역시 너무나 맘에 들었습니다. 현재 인코딩에서 웹 백엔드 수업도 수강하고 있구요, 이 강의가 끝나면 유니티 강의도 수강해보려 합니다.

마지막으로 좋은 강의를 개설해 주신 인코딩 운영진분들께 감사의 말씀을 전합니다.

- 누구나 할 수 있는 웹페이지 만들기 11기 수강생 윤영진 드림


수강생 이지은님

저는 html을 어느 정도 독학을 했었는데, 혼자서 공부하는 데 어려움이 많아서 강의를 수 강하게 되었습니다. 무엇보다 친구가 먼저 수강했었는데 너무 잘 가르쳐주시고 믿음직스럽 다고 해서 저도 시작한 거였어요.

직접 수업을 들어보니 정말 강사님들 모두 친절하시고 강의 내용도 알차고 참 좋았습니다! 제가 혼자 공부하면서 잘못 이해하고 넘어간 부분이나, 정석적인 방법으로 사용하지 않고 제멋대로 작성한 코드들을 수정해주셔서 이해도가 한층 높아졌습니다ㅎㅎ

수강생 최경완님

평소 웹사이트 제작에 관심이 있었지만 워낙 배워야 할 범위가 넓다보니 혼자 시작하기 막 막하고 겁이 났습니다. 결과적으로 스터디인코딩에서 배우길 잘했다는 생각이 듭니다. 비전 공자에다가 배경지식도 없어서 다른 ‘수강생들에 비해 수업 이해도가 떨어지면 어떡하지’ 라 는 걱정을 했었는데, 막상 강의를 들어보니 강사님이 쉽게 이해할 수 있도록 설명을 해주셔 서 개인 웹 페이지를 만들 수 있는 수준까지 왔습니다.

그동안 학원 같은 곳을 다녀보면 설명해줘도 잘 이해를 못하면 그냥 외우라는 식으로 말하 거나, 다시 가르쳐주기 귀찮은 티를 내면서 집에서 따로 공부해오라고도 하는데, 강사님께서 는 강의 내용을 완벽히 이해할 때까지 여러 방법을 바꿔가며 설명을 해주셔서 그 열정에 감 탄하기도 했습니다.

제 주변사람들도 저와 마찬가지로 웹에 관한 지식이 없어서 개인 작업으로 진행하는 터라 여럿이서 하는 스터디의 이점을 누리진 못했지만, 웹 개발자들이 주로 사용하는 개발자 사 이트나 개발 방법 혹은 자주 겪게 되는 실수 등을 자세히 설명해주시니 저로서는 큰 재산으 로 남은 것 같습니다.

그동안 못난 수강생 가르쳐주셔서 감사했고, 또 좋은 인연이 되길 기대합니다!


수강생 김지은님

강의를 잘 한다, 내용이 좋다 이런 것들은 둘째치고 강사님들이 정말 열정적으로 가르쳐주셨어요 제가 컴퓨터 자체를 잘 다루는 편이 아니여서 따라가는게 좀 어려웠어요.. 그래서 수업시간에도, 끝나고도, 수업시간 외에도 개인적으로 질문을 정말 많이 했어요..ㅜㅜ 하루에 대여섯번씩 카톡으로 물어봐도 항상 친절하게 답변해주신 엄기석 강사님ㅜㅜ..넘나 귀찮으셨을거에요.. 죄송하고 감사합니다!!!! 인코딩 항상 응원할게요 ( 강사님이 아주 훈남이에요 :D )

수강생 홍은영님

웹 프론트엔드 11기 수강생 홍은영입니다!

저는 이 강좌를 듣기 이전에 책과 유튜브 강좌로 웹페이지를 제작해보려 했는데, 대부분의 강좌들이 근본적인 구조나, 프로그래밍을 알려주기 보다는 단순히 따라하기 위주의 강의를 진행하고 있더라구요. 그래서 저만의 웹페이지를 만드는데에는 많이 부족하다고 느껴 오프라인 강좌를 찾던 중 페이스북에서 인코딩에대한 정보를 접하고 수강신청을 했습니다.

배우는 방식을 볼때, 웹 프론트엔드에 대한 탄탄한 기초를 쌓고 자신만의 웹페이지를 제작해 보고 싶으신 분들에게 이 강의는 정말 딱 맞는 강의라고 저는 자신있게 말할 수 있습니다. 웹페이지를 만드는 기본적인 요소들을 하나하나 꼼꼼히 배우고, 그와 맞춘 실습을 진행하면서 배운 내용은 완벽히 제 것으로 만드는 시간을 가졌습니다. 강의 이름 그대로 누구나 할 수 있는 웹사이트 만들기 강의였습니다.

자신만의 웹페이지를 만들어 보고 싶으신 분들은 이 강의를 꼭 수강하셔서 목표한 바를 이루 시길 바랍니다! :)