문과생이 가르쳐 주는 퍼블리싱 - 클론코딩

Name: 문과생이 가르쳐 주는 퍼블리싱 - 클론코딩
Price: 9240 KRW
Rating: 4.8 (5 reviews)

퍼블리셔가 되기 위한 초급~중급 과정을 배웁니다.

(4.8) 수강평 5개

수강생 47명

난이도 초급

수강기한 무제한

러빙코드

클론코딩

LG전자

임직원들도 이 강의를 듣고 있어요!

LG전자

임직원들도 이 강의를 듣고 있어요!

먼저 경험한 수강생들의 후기

4.8

5.0

도전

8% 수강 후 작성

이번 강의도 잘 듣고 있습니다. 단계별로 알아듣기 쉽게 차근차근 진행되는 강의 덕에 알차게 공부하고 있습니다. 다음 강의도 기대됩니다!!!

5.0

박종규

100% 수강 후 작성

메인 페이지에서 많이 사용되는 기술들을 쉽게 설명해 주셔서 좋았습니다. 제이쿼리가 노베이스면 어려울 수 있으니 선행학습 먼저 하시고 수업 들으시면 더 좋을 것 같아요 :)

5.0

조용한 코알라

100% 수강 후 작성

알아듣기 쉽게 설명해 주셨어요

수강 후 이런걸 얻을 수 있어요

웹사이트 메인 화면 퍼블리싱
실무에서 바로 활용 가능한 기술 및 팁!
프로젝트 노하우를 통한 다양한 간접 경험!

실무 경험 빠방한! 퍼블리셔의
현장 꿀팁과 노하우가 내 거 ❤️

직접 쳐보면서 배우는
웹사이트 클론코딩 👨‍💻

웹사이트의 메인화면에서 사용빈도가 높은 스크립트 UI를 배워봅니다. GNB, 배너 슬라이더, 탭, 박스를 열고닫는 스크립트 등 다양한 것을 만들어볼 수 있답니다. 비교적 간단해보이지만 차근차근 배워보면 추후에는 복잡한 UI를 퍼블리시하는데 도움이 되실거에요!

1. 영역별로 어떻게 코딩을 할지 디자인 완성본을 보고 설명하면
2. 들은 강의의 내용대로 코딩을 해본 후
3. 제가 설명한 코딩의 내용과 같은지 비교하면서 들어보세요!

_{웹사이트 메인화면을 똑같이 그대로 코딩해봐요!}
현장에서만 알 수 있는 꿀팁 대방출 😎

안녕하세요, 러빙코드입니다.
저는 처음 웹에 뛰어들었을 때 코딩 기술을 익히는 것보다 생소한 컴퓨터 용어를 서칭하는데 더 많은 시간을 썼던 기억이 있어요.

퍼블리셔는 디자이너와 개발자 간의 소통의 다리 역할을 하게 되는데요. 소통을 위해선 서로 간의 언어를 이해하고 재해석하는 게 중요합니다. 15년의 연차가 쌓이면서 자연스럽게 그 방법을 알게 되었고요. 저 같은 문과생이 퍼블리셔에 도전하며 겪은 경험과 노하우로 강의를 만든다면 맨땅에 헤딩하려는 분들이 조금은 덜 아프지 않을까 생각했습니다.

바로 써먹을 수 있도록
활용도 높은 디자인 UI로 실습해봐요 🎨

퍼블리셔는 다른 직군보다 진입장벽이 낮지만, 졸업까지 가는 길은 험난합니다.
하지만 기술은 열심히 하면 늘어요. 현란한 테크닉 또한 필요할 때마다 레퍼런스를 찾아서 이용해도 돼요.
중요한 건 기본에 충실해야 한다는 거죠. 기본만 알면 신기술도 쉽게 배울 수 있어요.
제가 15년 이상 현장에서 퍼블리싱하며 절대 잊지 않는 원칙이에요. 그럼 저와 시작해볼까요?

이런 분들께 추천해요 🙋‍♀️

나만의 포트폴리오를
준비하는 취준생

회사에 나 혼자 달랑!
사수가 필요하신 분

독학한 퍼블리싱을
upgrade하고 싶은 분

퍼블리싱에 대한
이해도를 쌓고싶은 분

이런 분들께
추천드려요

학습 대상은
누구일까요?

초급 과정 마스터 후 나만의 포트폴리오를 준비하는 취준생!
회사에 신입으로 취업했더니 나 혼자 달랑! 사수가 필요하신 분!
혼자 독학한 퍼블리싱을 검증하고 업그레이드 하고 싶은 분~
웹사이트 퍼블리싱 제작 과정에 대한 이해도가 필요하신 분!

선수 지식,
필요할까요?

문과생이 가르쳐 주는 퍼블리싱 - 초급

안녕하세요
러빙코드입니다.

3년은 웹디자이너이자 플래셔로 15년은 웹 퍼블리싱과 프론트앤드 개발로 밥 먹고 사는 퍼블리셔입니다.

18년이상 it에 몸담으며

웬만한 대기업 프로젝트 경험은 다 해본 듯 하며...

최근 활동은

한화생명, BC카드, 한전, 삼성, 수협, 두산, 넥슨, 파고다, sk등 다수 프로젝트 참여!

현 팀을 운영하며 프리랜서로 활동 중!

* 퍼블리셔는 다양한 경험 만이 길게 오래갈 수 있는 경쟁력이 됩니다^^

커리큘럼

전체

26개 ∙ (4시간 20분)

해당 강의에서 제공:

수업자료

섹션 1. 시작하며...

1개 ∙ (2분)

1. 오리엔테이션
02:59

섹션 2. 프로젝트 셋팅하기

2개 ∙ (20분)

2. 코딩가이드
08:47
3. 태그 리셋 및 공통 css 셋팅
11:17

섹션 3. html 구조설계

6개 ∙ (1시간 2분)

4. 상단 공통 영역 설계
10:06
5. 메인배너 설계
08:59
6. 강좌 텝 영역 설계
14:05
7. 게시판 영역 설계
13:48
8. 바로가기 영역 설계
06:03
9. 하단 공통 영역 설계
09:06

섹션 4. css 스타일 입히기

12개 ∙ (2시간 31분)

섹션 5. 제이쿼리 동작

5개 ∙ (23분)

강의 게시일:

마지막 업데이트일:

수강평

전체

5개

4.8

5개의 수강평

도전
수강평 2
∙
평균 평점 5.0
5
8% 수강 후 작성
이번 강의도 잘 듣고 있습니다. 단계별로 알아듣기 쉽게 차근차근 진행되는 강의 덕에 알차게 공부하고 있습니다. 다음 강의도 기대됩니다!!!
- 러빙코드
  지식공유자
  step1 이어 step2 강의도 들어주셔서 너무 감사해요~ 제 강의가 현장에서 도움이 될 수 있기를 바랄게요~ 꼬옥~^^
조용한 코알라
수강평 1
∙
평균 평점 5.0
5
100% 수강 후 작성
알아듣기 쉽게 설명해 주셨어요
- 러빙코드
  지식공유자
  끝까지 완강하셔서 실무에 조금이나마 도움이 되었으면 좋겠어요 :)
신동순
수강평 1
∙
평균 평점 5.0
5
100% 수강 후 작성
도움이 많이 되요~
- 러빙코드
  지식공유자
  도움이 되셨다니 다행이에요. 실무에서도 제 강의가 도움이 되었으면 해요~^^
박종규
수강평 4
∙
평균 평점 5.0
5
100% 수강 후 작성
메인 페이지에서 많이 사용되는 기술들을 쉽게 설명해 주셔서 좋았습니다. 제이쿼리가 노베이스면 어려울 수 있으니 선행학습 먼저 하시고 수업 들으시면 더 좋을 것 같아요 :)
- 러빙코드
  지식공유자
  질문들을 해주셔서 기억에 남았는데.. 끝까지 완강해주셔서 너무 감사해요. 말씀처럼 스크립트 부분을 선행학습 해 오시면 도움이 많이 되겠네요~ 실제 실무에서 스크립트 때문에 많이 들 어려워 하셔서 실무에 자주 사용되는 스크립트 소스들을 일부러 강의에 넣어둔 이유도 있어요. 실무에 우선 가져다 쓰시라고요. 실무에서도 제 소스들이 도움이 많이 되었으면 해요~
신형화
수강평 1
∙
평균 평점 4.0
4
15% 수강 후 작성
다 좋은데.. html,css등등 작성하면서 실시간으로 어떻게 결과물이 나오는지 모르겠네요 그냥 한화면에서만 계속 작성만하니까 내가 하고있는게 맞는건지모르겠고,, 다른 분들 보면 듀얼화면으로 실시간으로 html,css작성하는 결과물이 옆으로 나와서 이렇게 이루어지는구나라고 나오는게 알겠지만, 이거는 그냥 계속 코딩만 하고 어떻게 프로세싱이 되는지 모르니까 모르겠네요.. 죄송하지만 강의 2개까지듣고 끕니다.. 다른사람들은 어떻게생각하는지 모르겠지만 저의 공부 스타일은 아닌거같아요 그래도 강의 만드시느라 고생하셨습니다.
- 러빙코드
  지식공유자
  강의에 어려움이 있으셨다니T.T;;. 계속 들으시면 실무팁들이나 실제 실무에서 일어날 수 있는 실수에 대해 은연중에 학습할 수 있는 구조로 강의를 만들었는데 도움이 못 되드려 제 마음도 안 좋아요~ 부디 도움이 되는 강의를 만나셨으면 하는 바램이에요~

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

실전! 웹사이트제작! Step by Step! ('라한호텔' 사이트제작_Application Course)

J.영

'호텔 현대라한_목포점' 사이트 제작으로, 실제 웹사이트 메인페이지를 그대로 제작·구현해보는 강의입니다. html/css기초 지식이 있는 분들을 대상으로 html Markup과 Layout제작에 대한 이해는 물론 Fixheader, Image Slider, MenuOpen Bar, Scroll Animation 제작까지의 웹에서 꼭 필요로한 skill을 배울 수 있는 웹페이지 제작 실전! 강의입니다.

초급

HTML/CSS, jQuery, 인터랙티브 웹

실전! 웹사이트제작! Step by Step! ('라한호텔' 사이트제작_Application Course)

J.영

모던 웹 인터렉티브 CSS3 [PART2/3]

영코디 킴쌤

초등학생 코딩교육부터 시작하여 IT소프트웨어학과의 고등학생, 컴공과 대학생, 비전공자인 취준생을 대상으로 15년 넘게 코딩교육에 전념해온 현직 스타강사 영코디 킴쌤의 쉽고 재미있는 코딩강의를 이제 오프라인 뿐만 아니라 온라인에서도 만나실 수 있습니다. 500여명이 넘는 프론트엔드, 백엔드, 풀스택, 웹 개발자를 배출해온 영코디 킴쌤과 함께라면 당신의 개발자 꿈도 곧 현실이 됩니다!

입문

HTML/CSS, 웹 디자인, css3

모던 웹 인터렉티브 CSS3 [PART2/3]

영코디 킴쌤

쌩초보, 비전공자를 위한 [HTML 스타터] 부트캠프

영코디 킴쌤

초등학생 코딩교육부터 시작하여 IT소프트웨어학과의 고등학생, 컴공과 대학생, 비전공자인 취준생을 대상으로 15년 넘게 코딩교육에 전념해온 현직 스타강사 영코디 킴쌤의 쉽고 재미있는 코딩강의를 이제 오프라인 뿐만 아니라 온라인에서도 만나실 수 있습니다. 500여명이 넘는 프론트엔드, 백엔드, 풀스택 개발자를 배출해온 영코디 킴쌤과 함께라면 당신의 개발자 꿈도 곧 현실이 됩니다!

입문

HTML/CSS, 웹 디자인, 클론코딩

쌩초보, 비전공자를 위한 [HTML 스타터] 부트캠프

영코디 킴쌤

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

도도(코딩루팡)

React, Next.JS 14, TailwindCss, RadixUI, Shadcn, zustand 으로 YoutubeMusic 웹사이트를 클론합니다. NextJS 기초부터 UI 중점으로 웹프론트 기초를 마스터 할 수 있어요.!

초급

Next.js, React, TailwindCSS

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

도도(코딩루팡)

실전! 웹사이트제작! Step by Step! (한국소비자원 소비자시대- 레이아웃제작 기초)

J.영

[웹사이트제작 Step By Step] 초급 강좌로, 한국소비자시대 웹진(현재는 리뉴얼 됨) 메인페이지를 그대로 제작해 보는 과정입니다.

초급

HTML/CSS, jQuery, 인터랙티브 웹

실전! 웹사이트제작! Step by Step! (한국소비자원 소비자시대- 레이아웃제작 기초)

J.영

카페 24 베스트 쇼핑몰 디자인 클론코딩하기 (HTML + CSS)

같이코딩

카페 24에 올라온 베스트 쇼핑몰 디자인을 직접 클론코딩해보며 빠르게 HTML과 CSS를 학습할 수 있습니다. HTML + CSS에 대한 기본적인 이론을 학습하고 직접 클론코딩을 통해 쇼핑몰 디자인을 완성하여 이론에서 배웠던 내용을 적용하고 견고하게 HTML과 CSS의 틀을 잡을 수 있게 강의를 구성했습니다

입문

클론코딩, HTML/CSS, 웹 디자인

카페 24 베스트 쇼핑몰 디자인 클론코딩하기 (HTML + CSS)

같이코딩