💻내 손으로 나만의 웹사이트를 직접 만들 수 있다면?

웹사이트 제작, 개발자만의 영역이라고 생각할 수 있지만 어렵지 않은 방법으로 누구나 시작할 수 있어요. 웹 개발의 가장 필수적인 HTML과 문서를 보다 예쁘게 꾸며줄 수 있는 CSS를 배워 나만의 웹사이트를 제작해 봅니다.

웹사이트 제작을 할 줄 안다면,

1. 나만의 블로그를 만들어 나의 일상을 기록할 수 있어요.
2. 친구들과 함께 이야기를 나눌 수 있는 메신저를 만들 수 있어요.
3. 나의 상품을 판매할 수 있는 쇼핑몰을 만들 수 있어요.

🔍 어떤 걸 배우나요?

우리가 매일매일 사용하는 메신저 어플리케이션! 유명한 어플리케이션 카*오톡을 따라서 '클론코딩'하며 직접 메신저 웹페이지를 제작해봅니다.

클론코딩이란?

클론코딩은 카*카오톡, 페*스북 인*타그램 등 실제 서비스를 복제하여 따라 만들어보는 것으로, 코딩 경험을 빠르게 쌓고 감각을 익히는 데에 최적화된 프로그래밍 학습 방법입니다. 기초 이론이나 개념을 직접 사용해 결과물을 구현해 내는 경험은 실력 레벨업에 아주 큰 도움이 됩니다.

1️⃣단계. 웹사이트를 구성하는 HTML과 CSS 기본 요소 살펴보기

웹사이트를 만드는 데에 필수로 알고 있어야 하는 개념인 HTML과 CSS, 각 핵심을 정리하며 기초를 탄탄하게 다져봅니다. 만약 HTML/CSS를 전혀 모르더라도 걱정하지 마세요! 유노코딩이 제공하는 무료 클래스로, 코딩을 해보시지 않은 분들도 쉽게 따라갈 수 있도록 도와드립니다.

※ 무료 클래스 안내는 페이지 아래에 안내드립니다.

2️⃣단계. 메신저의 핵심 요소, 기능 구현하기

• 메신저에 들어가야 하는 가장 필수적인 요소인 1) 로그인 화면, 2) 채팅/친구 목록, 3) 채팅 화면을 내 손으로 직접 만들어봅니다.
• HTML과 CSS를 배웠지만 어떻게 활용해야 할지 몰랐다면, 웹 페이지가 하나하나 내 손으로 만들어지는 것을 보면서 앞으로의 스텝도 구상해볼 수 있을 거예요.

1) 로그인 화면

2) 채팅과 친구 목록

3) 채팅창

3️⃣단계. 내 웹사이트를 널리 알리기 위한, 배포하기

잘 만든 페이지를 나만 갖고 있기에는 아쉽죠! 많은 사람들이 내 페이지를 방문할 수 있도록 널리 알리는 단계, '배포'를 해봅니다. 무료 호스팅 업체를 활용해 인터넷에 나의 사이트를 등록해봐요.

여러분이 얻어갈 수 있는 것

웹 코딩의 기초를 습득

HTML/CSS의 역할과 사용법 외에도 웹, 프로그래밍, 코딩 등에 대한 기초적인 이해를 갖추게 될 것입니다.

내 손으로 웹사이트를 만드는 즐거움

메신저 웹사이트 완성 경험을 바탕으로 웹 코딩에 자신감이 생길 것이며, 이는 여러분이 다음 스텝으로 나아갈 수 있는 발판이 되어줄 것입니다.

이 클래스를 꼭 들어야 하는 이유

이론은 핵심만, 실습 위주의 클래스

핵심 이론을 담백하게 설명하고, 이론을 적용해 보는 실습으로 지루함을 덜어내고 성취감을 더할 수 있습니다.

내 손에서 탄생하는 나의 웹사이트

처음부터 끝나지! 내 손으로 한 땀 한 땀 직접 웹사이트를 만들어 봅니다.

초보자의 LEVEL UP을 위한 클래스

직접 결과물을 만드는 과정에서 자연스럽게 다음 단계까지 생각하고, 학습을 이어갈 수 있도록 도와드립니다.

이런 분들에게 추천합니다!

• 처음부터 끝까지, 내 손으로 직접 웹사이트를 만들어 보고 싶으신 분
• HTML/CSS 기초를 학습했지만, 활용 능력이 없어 고민인 분
• HTML/CSS 언어를 배우고자 하시는 분
• 이론 위주의 수업이 지루하고 답답하신 분

학생도 알아들을 수 있는

쉬운 초보자 맞춤형 설명을 지향합니다

누구나 이해할 수 있도록 가르쳐 드릴게요

고등학생 대상으로 진행된 강의 사진

반드시 확인해주세요!

선수 지식 : HTML, CSS

준비물 : 컴퓨터와 영타 능력

• 본 클래스는 맥북을 통해 진행 및 촬영됩니다. 그러나 윈도우를 사용하셔도 충분히 수강하실 수 있습니다.