안녕하세요. rocks'easyweb의 김동주 강사입니다.

 

 

피그마활용 웹디자인 & 웹퍼블리싱 강의를 그린컴퓨터아트학원(종로점)에서 재직자 수업(일반도 신청가능)으로 진행합니다.

 

기초는 있지만 종합적으로 적용이 어려운 분,반응형이 힘든 분,모바일 전용 쇼핑몰 구현이 궁금한 분

 

한번 도전해보세요!

1. 강의 일정

개강일: 1월30일~3월14일(화목, 13일)

강의장: 그린컴퓨터아트학원 종로지점 - 212호

휴강일: 2/8(목)---------[※ 이외 공휴일휴무]

교육시간: 19:10~22:10(3H)

문의: 02-722-2111

수강상담 신청하기: https://forms.gle/6vqGTSnuq2ntzaFY8

모집인원: 20명

2. 강의 내용

피그마 기초
- Adobe XD, sketch, Figma 비교
- 설치, UI 메뉴,  프레임
- 쉐이프, 클리핑 마스크, 펜툴, 폰트 위계
- 컴포넌트, 프로토 타이핑
- UI 디자인 원칙
- 그리드

피그마 웹디자인 실무
- 버튼, 배너
- 배너, 서비스, 후기
- 푸터, 회사소개페이지
- 서브페이지, 아코디언
- 서브페이지, 회원가입, 로그인

디자이너의 피그마 활용(응용) 
- 피그마 반응형 디자인 
- 피그마 모바일 쇼핑몰

(상기 일정은 학습 여건에 따라 변경될 수 있습니다.)

 

3. 대상

- 포토샵 또는 일러스트로 웹디자인을 한 경험이 있는 분 또는 없는분도 가능

  (포토샵, 일러스트레이터를 몰라도 피그마는 가능합니다.)

 

 

- 코딩 친화적인 디자인과 전체 프로세스를 경험해보고 싶은 분

 

4. 수업내용 미리보기

피그마 디자인 & 디자인 참고 웹페이지 구현하기

 

디자인 참고 웹페이지 구현하기

 

5. 문의

- 02-722-2111

- ezwebpub@gmail.com

- 수강상담 신청하기: https://forms.gle/6vqGTSnuq2ntzaFY8

6. 선행학습

제 유튜브 영상의 재생목록에서 아래 차시를 미리 학습해주시면 감사하겠습니다.

 

유튜브 채널: https://www.youtube.com/@ezweb

7. 수강후기

 

반응형

안녕하세요. rock's ezweb 김동주 강사입니다.

현재 진행중인 기업연계 프로젝트형 프론트엔드 웹&앱 SW개발자 양성 과정의 4차 수강생을 모집합니다.

3차과정과 비교하여 개인 프로젝트가 추가되었으며, Reat 과정 시간이 대폭 늘었습니다. 

 

웹퍼블리싱 기초부터 백엔드 프로그래밍까지 차근차근 빡세게 가르쳐드립니다.  아래 영상으로 확인하실수 있습니다.

비전공자, 전공자 상관없이 기초부터 확실하게 학습하고 과정중 완성하는 프로젝트를 통해 포트폴리오를 완성하는 과정입니다.

많은 관심 부탁드립니다.

 

결코 쉬운 길은 아니지만 못갈 길도 아닙니다! 도전해보세요.

 

https://youtu.be/GPDql1NkYHY

 

취업분야

웹기획자, 웹디자이너, 웹퍼블리셔, 프론트엔드 개발자, 백엔드개발자

 

총 훈련시간 : 960시간

훈련기간 : 2024년 6월중 개강 예정(월-금, 120일)
교육시간 : 09:30~18:30 [월-금]

 

사용프로그램

MySQL, git, Figma, Adobe Master Collection CC, MariaDB, Visual Studio Code, 라라벨(laravel), React, React Router, Firebase, Express js

 

본 교육 과정은 K-Digital Training 훈련 과정입니다.

- K-Digital Training은 우리나라 디지털, 신기술 분야에서 핵심적인 역할을 담당할 인재를 양성하기 위해 고용노동부와 함께하는 훈련과정이며, ‘국민내일배움카드’만 발급받으면 정부의 전액 지원으로 무료 수강할 수 있습니다.

 

[HRD-Net 기관정보]

- 훈련기관명 : 그린컴퓨터아트학원 종로
- 수강료 : 전액무료
- 직업능력훈련기관 우수훈련기관 5년인증 획득 

- 전화문의 : 02-722-2111

- 수강 상담 신청하기 : https://bit.ly/3PNqkfP

 

교과목 안내

No. 교과목명 시간
1 기초부터 확실하게!
(HTML, 스타일 설정을 위한 CSS 기초 학습)
104
- 웹앱의 동작원리
- 웹 표준과 브라우저 
- VS Code 설치 및 실행 
- HTML 개요
- CSS 개요
- CSS 속성
- HTML/CSS 기초 문법
- Figma 툴 활용
- 레이아웃 구현 기초
- 플렉서블 레이아웃 구현
- Git을 활용한 버전관리
2 웹 프로그래밍의 꽃!
(JavaScript를 활용한 다양한 효과 적용)
88
- javascipt 기본 개념, 동작 원리, 개발 환경, 실행 방법
- 변수, 데이터 타입, 배열, 연산자, 객체, 함수
- 제어문
- 프로퍼티 정의생성자 함수에 의한 객체 생성, 프로토타입
- 전역 객체, this, 실행 컨텍스트, 클로저
- 클래스, 모듈, 웹팩
- ES6 함수 추가 기능
- String/Number/Date/Math/정규표현식
- 스프레드 문법
- 디스트럭처링 할당
- 문서 객체 모델(Document Object Model)
- 동기식 처리 모델 vs 비동기식 처리 모델
- 이벤트
- Ajax- REST API
- 자바스크립트 DOM 조작
- Form Input Validation Test
3 웹앱에 생명을!
(웹 상에 배포하기 위한 네트워크 기초 학습)
16
- 클라이언트, 서버 아키텍처의 이해
- 브라우저의 작동원리 학습
- 네트워크의 기초 지식 기반 REST API 이해 및 활용
4 웹앱에 생명을!
(데이터베이스를 이용해 살아있는 웹 앱 구현)
32
- 데이터베이스 개요
- 데이터베이스 모델링
- SELECT GROUP BY
- INSERT, UPDATE, JOIN
- Sub-Query, Index, View, Replication
- BackUp, MongoDB
5 웹앱에 생명을!
(SQL함수를 활용한 정교한 웹 앱 구현)
40
- 날짜형 함수 , 문자형 함수, 숫자형 함수
- CASE, JOIN
- COUNT, SUM, AVG, MIN, MAX
6 Web Project-static Web App (개인 프로젝트) 32
- 훈련생 관심분야 웹사이트 선정 리뉴얼 프로젝트
- 순수 자바스크립트 기반 웹사이트 구현
7 웹앱을 정석대로!
(다양한 유저가 사용할 수 있는 웹 앱 구현)
32
- 웹표준과 웹접근성을 준수하는 웹 앱 구현
- 크로스 브라우징 및 접속 환경 차이 학습
8 웹앱을 보다 화려하게!
(UI/UX를 이용한 인터랙티브한 웹 앱 학습)
64
- UX 기반 화면 구성의 효과와 방법
- 사용성 높은 UI 이해와 적용
- 사용성 높은 UX 이해와 적용
- Search Engine Optimized 웹앱
9 웹앱을 보다 편리하게!
(Bootstrap 프레임워크 활용)
32
- grid sytem
- content
- form
- components
- utilities 활용
10 시가총액 100대 기업내 선정 Renewal Project
(팀 프로젝트)
80
- 100대 기업내 선정 리뉴얼 프로젝트
- 반응형 웹사이트 구현
- 부트 스트랩 활용
11 나두 한다! 인증과 웹보안
(데이터베이스와 인증 학습)
26
- 로그인 절차와 방법
- 사용자를 구분하기 위한 인증방법
- HTTP에서 클라이언트
- 서버간 통신 흐름
- 웹 보안의 중요성과 보안 방법
12 트렌드 따라하기! 서버리스 웹앱
(AWS 클라우드 활용 배포)
40
- AWS 클라우드 이해 
- AWS 계정 생성
- EC2 생성
- Node.js,MySql 설치
- AWS 클라우드API 활용 (리눅스, 아파치 서버, 인스턴트, EMR)
- AWS 배포
13 LMS(학습지원시스템) Project
(팀 프로젝트)
192
- LMS(강좌 관리 시스템) 관리자 페이지 제작
- LMS(강좌 관리 시스템) 유저 페이지 제작
14 나두 한다! React 
(React를 이용해 효율적인 웹앱 구현)
146
- SPA 이해 및 React 설치
- 샘플 웹앱 실행하기
- 컴포넌트
- props
- state, state 이벤트 연결
- 컴포넌트 이벤트 만들기, 리펙토링, 리덕스
- 삭제, 편집 페이지 구현
15 곧 취업! 참여기업 현장실무특강 8
16 미션 도전! 해커톤
(참여기업 미션 수행)
16
17 곧 취업! 커리어 서비스 12
- 자기소개서 컨설팅 
- 면접 및 이력서 관련 교육
- 컴퍼니 리서치
- 계약서 작성 주의사항
- 비즈니스 에티켓
합계   960

 

주요 프로젝트(포트폴리오)

1st 프로젝트  : Web Project static Web App 

  • 관심사이트 선정 리뉴얼 프로젝트
  • 웹개발의 기획, 설계, 디자인, 구현, 런칭의 웹개발 기본 프로세스를 느껴본다.  
  • 소규모 팀웍을 체험한다.

수강생 포트폴리오 - 스타벅스 리뉴얼
수강생 포트폴리오 - CGV 리뉴얼

 

2nd 프로젝트  : 시가총액 대 100 기업내 선정 Renewal Project

  • 메인페이지외에 다양한 서브페이지를 구현한다.
  • 크로스 브라우징, 반응형등 다양한 환경에 최적화된 웹 앱을 구현한다.
  • 본격적인 협업을 경험한다.

수강생 포트폴리오 - 삼성 디스플레이 리뉴얼
수강생 포트폴리오 -  - 삼성 디스플레이 리뉴얼 반응형

 

3rd 프로젝트  : LMS(학습지원시스템) Project 

  • 강좌관리시스템  관리자 페이지와 사용자 페이지 제작
  • LMS 인프런 강좌관리시스템  관리자 페이 지 제작
  • 관리자 페이지를 설계하고 구현된 GUI를 통해 데이터 생성, 조회, 삭제, 출력할 수 있다.
  • 강좌등록, 수정, 삭제, 조회 / 쿠폰 관리 / 회원관리등 관리자 기능을 구현할 수 있다.

수강생 포트폴리오 - 관리자 페이지 대쉬보드

  • 일반 유저용 페이지를 구축하여 강의 목록 조회, 상세내용 보기, 수강신청하기,  학습관리를 할 수 있다.

수강생 포트폴리오 - 강의 소개
수강생 포트폴리오  - 강의 상세화면
수강생 포트폴리오 - 클래스 목록
수강생 포트폴리오 - 강좌 상세화면

문의 상담 신청하기 : https://bit.ly/3PNqkfP

 

수강상담 신청하기

- 과정명 : 『기업연계 프로젝트형』 웹디자인(웹퍼블리셔)&프론트엔드 SW개발자 양성 교육기간: 23/11/15 ~ 24/5/13 교육시간 : 09:30~18:30 [월-금] ** 모집현황에 따라 변동될 수 있습니다. 과정안내 : 과

docs.google.com

 

3회차( 2023-05-12 ~ 2023-10-31) 후기

수강생 후기

반응형

안녕하세요. rocks'easyweb의 김동주 강사입니다.

 

 

피그마활용 웹디자인 & 웹퍼블리싱 강의를 그린컴퓨터아트학원(종로점)에서 재직자 수업(일반도 신청가능)으로 진행합니다.

 

하루 3시간, 총 13일간 피그마를 활용한 웹디자인 기초와, 완성된 피그마 파일을 참조로 HTML, CSS, jQuery(javascript)등을 활용하여 웹페이지를 구현, 반응형 구현의 강의를 진행합니다. 또한 모바일 디자인을 참조하여 웹과는 다른 모바일의 환경에 최적화된 쇼핑몰을 구현합니다.

 

전반 5일은 디자인 파트는 디자인 초보자도 가능하지만, 7일간 코딩 파트의 강의내용은 html, css, script를 한번이라도 학습한 분을 대상으로 하기 때문에 기초가 부족한 분은 수업이 어려울 수 있습니다.

 

기초는 있지만 종합적으로 적용이 어려운 분,반응형이 힘든 분,모바일 전용 쇼핑몰 구현이 궁금한 분

 

딱 13일간 제대로 가르쳐 드립니다. 한번 도전해보세요!

최근 2023년 6월 22일 대규모업데이트를 포함하여 알찬 강의를 보장합니다.^^

1. 강의 일정

개강일: 8월22일~10월10일(화목, 13일)

강의장: 그린컴퓨터아트학원 종로지점 - 212호

휴강일: 9/28(목)10/3(화)--------[※ 이외 공휴일휴무]

교육시간: 오후 7시 ~ 오후 9:50    

문의: 02-722-2111

모집인원: 20명

2. 강의 내용

1 일차 디자이너의 피그마 활용


피그마 기본
- Adobe XD, sketch, Figma 비교
- 설치, UI 메뉴,  프레임
- 쉐이프, 클리핑 마스크, 펜툴, 폰트 위계
- 컴포넌트, 프로토 타이핑
2 일차 - UI 디자인 원칙
- 그리드

피그마 웹디자인 실무
- 버튼, 배너
3 일차 피그마 웹디자인 실무
- 배너, 서비스, 후기
- 푸터, 회사소개페이지
- 서브페이지, 아코디언
- 서브페이지, 회원가입, 로그인
4 일차
5 일차
6 일차 개발자의 피그마 활용
(쇼핑몰 디자인 참조 코딩)






피그마 디자인 to HTML
- 인덱스 페이지
- 공통 HTML, CSS 작성

- INDEX페이지 CSS
7 일차 피그마 디자인 to HTML
- ABOUT 페이지
- 로그인
- 회원가입
- 반응형
8 일차 모바일 쇼핑몰 구현하기
- index 페이지 HTML, CSS, SCRIPT
9 일차 모바일 쇼핑몰 구현하기
- 상품목록페이지 HTML, CSS, SCRIPT
- 회원가입 HTML, CSS
10 일차 모바일 쇼핑몰 구현하기
- 회원가입 HTML, CSS
- INDEX ASIDE 애니메이션 HTML, CSS, SCRIPT
11 일차
12 일차
13 일차

모바일 쇼핑몰 구현하기
- 상품 상세 HTML, CSS, SCRIPT
- 장바구니 HTML, CSS, SCRIPT

(상기 일정은 학습 여건에 따라 변경될 수 있습니다.)

 

3. 대상

- 포토샵 또는 일러스트로 웹디자인을 한 경험이 있는 분 또는 없는분도 가능

  (포토샵, 일러스트레이터를 몰라도 피그마는 가능합니다.)

 

- HTML5 태그를 학습한 분

h1~h5, ul, p, a, input등 기본태그를 사용할 수 있다.

header, footer, aside등 HTML5 태그를 이해할 수 있다.

(기초 수업은 아닙니다. 태그를 하나하나 설명할 시간을 없을 수 있습니다. )

 

- CSS 기초를 학습한 분

  float, position, flex, 반응형 등을 학습한 분

(완벽하게 이해하고 있지 못해도 써본 경험이 있으면 됩니다. )

 

- Javascript, jQuery를 학습 한 분

변수, 함수, 배열, 이벤트을 이해할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- jQuery 라이브러리를 사용해본 경험이 있는 분

bxslider, slick, swiper, jQueryUI을 적용할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- 디자인에서 코딩까지 전체 프로세스를 경험해보고 싶은 분

 

4. 수업내용 미리보기

피그마 디자인 & 디자인 참고 웹페이지 구현하기

 

디자인 참고 웹페이지 구현하기

 

5. 문의

- 02-722-2111

- ezwebpub@gmail.com

6. 선행학습

- 코딩 파트는 html, css, javascript, jQuery 기초가 있어야 수업을 따라 오실 수 있습니다. 

제 유튜브 영상의 재생목록에서 아래 차시를 미리 학습해주시면 감사하겠습니다.

 

유튜브 채널: https://www.youtube.com/@ezweb

- HTML 재생목록 : HTML5-N01 ~ N21
- CSS 재생목록 : CSS3 - N01 ~ N10, CSS3-40, 41, 42
- Javascript : 01 ~ 10  
- jQeury : 01 ~ 13

7. 수강후기

 

반응형

안녕하세요. rock's ezweb 김동주 강사입니다.

현재 진행중인 기업연계 프로젝트형 프론트엔드 웹&앱 SW개발자 양성 과정의 2차 수강생을 모집합니다.

웹퍼블리싱 기초부터 백엔드 프로그래밍까지 차근차근 빡세게 가르쳐드립니다.  아래 영상으로 확인하실수 있습니다.

비전공자, 전공자 상관없이 기초부터 확실하게 학습하고 과정중 완성하는 프로젝트를 통해 포트폴리오를 완성하는 과정입니다.

많은 관심 부탁드립니다.

 

결코 쉬운 길은 아니지만 못갈 길도 아닙니다! 도전해보세요.

 

https://youtu.be/GPDql1NkYHY

 

취업분야

웹기획자, 웹디자이너, 웹퍼블리셔, 프론트엔드 개발자, 백엔드개발자

 

총 훈련시간 : 960시간

훈련기간 : 05월12일~11월9일(월-금, 120일)
교육시간 : 09:30~18:30 [월-금]

 

사용프로그램

MySQL, git, Figma, Adobe Master Collection CC, MariaDB, Visual Studio Code, 라라벨(laravel), React

 

본 교육 과정은 K-Digital Training 훈련 과정입니다.

- K-Digital Training은 우리나라 디지털, 신기술 분야에서 핵심적인 역할을 담당할 인재를 양성하기 위해 고용노동부와 함께하는 훈련과정이며, ‘국민내일배움카드’만 발급받으면 정부의 전액 지원으로 무료 수강할 수 있습니다.

 

[HRD-Net 기관정보]

- 훈련기관명 : 그린컴퓨터아트학원 종로
- 수강료 : 전액무료
- 직업능력훈련기관 우수훈련기관 5년인증 획득 

- 전화문의 : 02-722-2111

실시간 비대면상담 바로가기 (카톡, zoom 등등) https://vo.la/S9cn89

 

교과목 안내

No. 교과목명 이론 실기
1 기초부터 확실하게!
(HTML, 스타일 설정을 위한 CSS 기초 학습)
8 32
2 기초부터 확실하게!
(HTML, CSS를 활용한 UI/UX 디자인 적용)
0 64
3 웹 프로그래밍의 꽃!
(JavaScript 기초 이해)
0 44
4 웹 프로그래밍의 꽃!
(JavaScript를 활용한 다양한 효과 적용)
0 44
5 웹앱에 생명을!
(웹 상에 배포하기 위한 네트워크 기초 학습)
8 8
6 웹앱에 생명을!
(데이터베이스를 이용해 살아있는 웹 앱 구현)
8 24
7 웹앱에 생명을!
(SQL함수를 활용한 정교한 웹 앱 구현)
0 40
8 Web Project static Web App ( 랜딩페이지 제작 ) 0 32
9 웹앱을 정석대로!
(다양한 유저가 사용할 수 있는 웹 앱 구현)
4 28
10 웹앱을 보다 화려하게!
(UI/UX를 이용한 인터랙티브한 웹 앱 학습)
8 56
11 웹앱을 보다 편리하게!
(Bootstrap 프레임워크 활용)
0 32
12 나두 한다! React
(React를 이용해 효율적인 웹 앱 구현)
0 32
13 나두 한다! React review (강좌 수강평 등록, 삭제, 편집) 0 32
14 시가총액 100대 기업내 선정 Renewal Project (삼성, LG계열사) 0 80
15 나두 한다! 인증과 웹보안
(데이터베이스와 인증 학습)
4 22
16 트렌드 따라하기! 서버리스 웹앱
(AWS 클라우드 활용 배포)
4 36
17 LMS(학습지원시스템) First Project
(강좌관리시스템 관리자 페이지 제작)
0 116
18 런칭전 다듬기! 최적화 및 배포
(성능개선을 위한 최적화 및 배포)
0 32
19 미션 도전! 해커톤
(참여기업 미션 수행하기)
0 16
20 LMS(학습지원시스템) Final Project
(강좌관리서비스 유저페이지제작)
0 126
21 곧 취업!
참여기업 현장실무특강
8  
22 곧 취업! 커리어 서비스
( 자기소개서, 면접교육, 컴퍼니 리서치 )
8  

 

주요 프로젝트(포트폴리오)

1st 프로젝트  : Web Project static Web App 

  • 스타벅스 커피사이트 웹 랜딩만들기
  • CGV 영화사이트 웹 랜딩만들기
  • 넥슨 게임사이트 웹 랜딩만들기
  • 웹개발의 기획, 설계, 디자인, 구현, 런칭의 웹개발 기본 프로세스를 느껴본다.  
  • 소규모 팀웍을 체험한다.

수강생 포트폴리오 - 스타벅스 리뉴얼
수강생 포트폴리오 - CGV 리뉴얼

 

2nd 프로젝트  : 시가총액 대 100 기업내 선정 Renewal Project

  • 삼성그룹계열사 선정 리뉴얼 프로젝트 
  • LG그룹계열사 선정 리뉴얼 프로젝트
  • 메인페이지외에 다양한 서브페이지를 구현한다.
  • 크로스 브라우징, 반응형등 다양한 환경에 최적화된 웹 앱을 구현한다.
  • 본격적인 협업을 경험한다.

수강생 포트폴리오 - 삼성 디스플레이 리뉴얼
수강생 포트폴리오 -  - 삼성 디스플레이 리뉴얼 반응형

 

3rd 프로젝트  : LMS(학습지원시스템) First Project 

  • 101 LMS 클래스 강좌관리시스템  관리자 페이지 제작 
  • LMS 인프런 강좌관리시스템  관리자 페이 지 제작
  • 관리자 페이지를 설계하고 구현된 GUI를 통해 데이터 생성, 조회, 삭제, 출력할 수 있다.
  • 강좌등록, 수정, 삭제, 조회 / 쿠폰 관리 / 회원관리등 관리자 기능을 구현할 수 있다.

수강생 포트폴리오 - 관리자 페이지 대쉬보드

 

4th 프로젝트  : LMS(학습지원시스템) Final Project 

  • 101 LMS 클래스 강좌관리시스템  유저 페이지제작  
  • LMS 인프런 강좌관리시스템  유저 페이지제작
  • 일반 유저용 페이지를 구축하여 강의 목록 조회, 상세내용 보기, 수강신청하기,  학습관리를 할 수 있다.

수강생 포트폴리오 - 강의 소개
수강생 포트폴리오  - 강의 상세화면
수강생 포트폴리오 - 클래스 목록
수강생 포트폴리오 - 강좌 상세화면

문의 상담 신청하기 : https://forms.gle/X3fSmzFvxhEvBUtz9

반응형

교육과정 : [웹코딩]UIUX반응형(리액트[React],자바스크립트)프론트엔드(퍼블리셔)개발자
강의장 : 212호
개강일 : 4월4일~5월16일(화목 13일)
휴강일 : ----------[※ 이외 공휴일휴무]
교육시간 : 19:00~22:00(3H)

 

SPA(single page application) 싱글 페이지 어플리케이션을 제작하는데 특화되어 있는 react의 기초를 학습할 수 있는 재직자반 커리큘럼을 소개합니다.

 

일반적인 웹페이지는 링크나 메뉴를 클릭하면 해당 페이지로 이동하고 페이지가 새롭게 모두 로드됩니다. 이방식은 변경되는 내용이 많은 경우는 효율적이지만 웹페이지의 일부 내용만 변경된다면 굉장히 비효율적인 방법입니다. 

이런 비효율적인 방식을 개선하는 방법으로 한페이지내에서 별도 새 페이지 오픈 없이 웹페이지의 일부 내용을 마치 앱처럼 변경할 수 있도록 javascript를 통해 구현하는 방식은 SPA입니다.

 

React 문법은 대부부은 javascript 이기 때문에 javascript를 심도있게 학습해야 이해할 수 있습니다. 

 

React 설치부터 핵심개념인 컴포넌트, 라우터, 리덕스까지 React의 기본기를 학습하실 수 있습니다.

리엑트 기초 01_React 설치
02_샘플 웹앱 실행하기
03_컴포넌트 생성하기
04_props
05_컴포넌트를 파일로 분리하기
06_state
07_state 이벤트 연결
08_이벤트 설치
09_컴포넌트 이벤트 만들기

완성본 예시 👉
리엑트 핵심 함수형 vs. 클래스형 비교

완성본 예시👉
컴포넌트 생명주기  
React Router
웹페이지 연결을 좀더 효율적으로

완성본 예시👉
react Ajax
외부 파일 활용하기
완성본 예시👉
react Redux
값 전달을 좀더 효율적으로

완성본 예시👉
리엑트 실전 React 게시판

문의 : 02-722-2111

 

 

 

 

반응형

안녕하세요. rocks'easyweb의 김동주 강사입니다.

 

피그마활용 웹디자인 & 웹퍼블리싱 강의를 그린컴퓨터아트학원(종로점)에서 재직자 수업(일반도 신청가능)으로 진행합니다.

강의는 오프라인으로 학원에 등원하거나 zoom을 통한 온라인 수강도 가능합니다.

 

하루 3시간, 총 13일간 피그마를 활용한 웹디자인 기초와, 완성된 피그마 파일을 참조로 HTML, CSS, jQuery(javascript)등을 활용하여 웹페이지를 구현, 반응형 구현의 강의를 진행합니다. 또한 모바일 디자인을 참조하여 웹과는 다른 모바일의 환경에 최적화된 쇼핑몰을 구현합니다.

 

전반 5일은 디자인 파트는 디자인 초보자도 가능하지만, 7일간 코딩 파트의 강의내용은 html, css, script를 한번이라도 학습한 분을 대상으로 하기 때문에 기초가 부족한 분은 수업이 어려울 수 있습니다.

 

기초는 있지만 종합적으로 적용이 어려운 분,반응형이 힘든 분,모바일 전용 쇼핑몰 구현이 궁금한 분

 

딱 13일간 제대로 가르쳐 드립니다. 한번 도전해보세요!

 

1. 강의 일정

개강일: 1월30일~3월15일(월수, 13일)

강의장: 그린컴퓨터아트학원 종로지점 - 212호

휴강일: 공휴일 휴무

교육시간: 오후 7시 ~ 오후 9:50    

문의: 02-722-2111

모집인원: 20명

2. 강의 내용

1 일차 디자이너의 피그마 활용


피그마 기본
- Adobe XD, sketch, Figma 비교
- 설치, UI 메뉴,  프레임
- 쉐이프, 클리핑 마스크, 펜툴, 폰트 위계
- 컴포넌트, 프로토 타이핑
2 일차 - UI 디자인 원칙
- 그리드

피그마 웹디자인 실무
- 버튼, 배너
3 일차 피그마 웹디자인 실무
- 배너, 서비스, 후기
- 푸터, 회사소개페이지
- 서브페이지, 아코디언
- 서브페이지, 회원가입, 로그인
4 일차
5 일차
6 일차 개발자의 피그마 활용
(쇼핑몰 디자인 참조 코딩)






피그마 디자인 to HTML
- 인덱스 페이지
- 공통 HTML, CSS 작성

- INDEX페이지 CSS
7 일차 피그마 디자인 to HTML
- ABOUT 페이지
- 로그인
- 회원가입
- 반응형
8 일차 모바일 쇼핑몰 구현하기
- index 페이지 HTML, CSS, SCRIPT
9 일차 모바일 쇼핑몰 구현하기
- 상품목록페이지 HTML, CSS, SCRIPT
- 회원가입 HTML, CSS
10 일차 모바일 쇼핑몰 구현하기
- 회원가입 HTML, CSS
- INDEX ASIDE 애니메이션 HTML, CSS, SCRIPT
11 일차
12 일차
13 일차

모바일 쇼핑몰 구현하기
- 상품 상세 HTML, CSS, SCRIPT
- 장바구니 HTML, CSS, SCRIPT

(상기 일정은 학습 여건에 따라 변경될 수 있습니다.)

 

3. 대상

- 포토샵 또는 일러스트로 웹디자인을 한 경험이 있는 분 또는 없는분도 가능

  (포토샵, 일러스트레이터를 몰라도 피그마는 가능합니다.)

 

- HTML5 태그를 학습한 분

h1~h5, ul, p, a, input등 기본태그를 사용할 수 있다.

header, footer, aside등 HTML5 태그를 이해할 수 있다.

(기초 수업은 아닙니다. 태그를 하나하나 설명할 시간을 없을 수 있습니다. )

 

- CSS 기초를 학습한 분

  float, position, flex, 반응형 등을 학습한 분

(완벽하게 이해하고 있지 못해도 써본 경험이 있으면 됩니다. )

 

- Javascript, jQuery를 학습 한 분

변수, 함수, 배열, 이벤트을 이해할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- jQuery 라이브러리를 사용해본 경험이 있는 분

bxslider, slick, swiper, jQueryUI을 적용할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- 디자인에서 코딩까지 전체 프로세스를 경험해보고 싶은 분

 

4. 수업내용 미리보기

피그마 디자인 & 디자인 참고 웹페이지 구현하기

 

디자인 참고 웹페이지 구현하기

 

5. 문의

- 02-722-2111

- ezwebpub@gmail.com

6. 선행학습

- 코딩 파트는 html, css, javascript, jQuery 기초가 있어야 수업을 따라 오실 수 있습니다. 

제 유튜브 영상의 재생목록에서 아래 차시를 미리 학습해주시면 감사하겠습니다.

 

유튜브 채널: https://www.youtube.com/@ezweb

- HTML 재생목록 : HTML5-N01 ~ N21
- CSS 재생목록 : CSS3 - N01 ~ N10, CSS3-40, 41, 42
- Javascript : 01 ~ 10  
- jQeury : 01 ~ 13

7. 수강후기

 

반응형

교육과정 : [웹코딩]UIUX반응형(리액트[React],자바스크립트)프론트엔드(퍼블리셔)개발자
강의장 : 212호
개강일 : 10월25일~11월29일(화목/화목금, 13일)
휴강일 : ----------[※ 이외 공휴일휴무]
교육시간 : 19:00~22:00(3H)

 

SPA(single page application) 싱글 페이지 어플리케이션을 제작하는데 특화되어 있는 react의 기초를 학습할 수 있는 재직자반 커리큘럼을 소개합니다.

 

일반적인 웹페이지는 링크나 메뉴를 클릭하면 해당 페이지로 이동하고 페이지가 새롭게 모두 로드됩니다. 이방식은 변경되는 내용이 많은 경우는 효율적이지만 웹페이지의 일부 내용만 변경된다면 굉장히 비효율적인 방법입니다. 

이런 비효율적인 방식을 개선하는 방법으로 한페이지내에서 별도 새 페이지 오픈 없이 웹페이지의 일부 내용을 마치 앱처럼 변경할 수 있도록 javascript를 통해 구현하는 방식은 SPA입니다.

 

React 문법은 대부부은 javascript 이기 때문에 javascript를 심도있게 학습해야 이해할 수 있습니다. 

 

React 설치부터 핵심개념인 컴포넌트, 라우터, 리덕스까지 React의 기본기를 학습하실 수 있습니다.

리엑트 기초 01_React 설치
02_샘플 웹앱 실행하기
03_컴포넌트 생성하기
04_props
05_컴포넌트를 파일로 분리하기
06_state
07_state 이벤트 연결
08_이벤트 설치
09_컴포넌트 이벤트 만들기

완성본 예시 👉
리엑트 핵심 함수형 vs. 클래스형 비교

완성본 예시👉
컴포넌트 생명주기  
React Router
웹페이지 연결을 좀더 효율적으로

완성본 예시👉
react Ajax
외부 파일 활용하기
완성본 예시👉
react Redux
값 전달을 좀더 효율적으로

완성본 예시👉

문의 : 02-722-2111

 

 

 

 

반응형

안녕하세요. rocks'easyweb의 김동주 강사입니다.

 

피그마활용 웹디자인 & 웹퍼블리싱 강의를 그린컴퓨터아트학원(종로점)에서 재직자 수업(일반도 신청가능)으로 진행합니다.

강의는 오프라인으로 학원에 등원하거나 zoom을 통한 온라인 수강도 가능합니다.

 

하루 3시간, 총 약12일간 피그마를 활용한 웹디자인 기초와, 완성된 피그마 파일을 참조로 HTML, CSS, jQuery(javascript)등을 활용하여 웹페이지를 구현, 반응형 구현의 강의를 진행합니다. 또한 모바일 디자인을 참조하여 웹과는 다른 모바일의 환경에 최적화된 쇼핑몰을 구현합니다.

 

전반 5일은 디자인 파트는 디자인 초보자도 가능하지만, 7일간 코딩 파트의 강의내용은 html, css, script를 한번이라도 학습한 분을 대상으로 하기 때문에 기초가 부족한 분은 수업이 어려울 수 있습니다.

 

기초는 있지만 종합적으로 적용이 어려운 분,반응형이 힘든 분,모바일 전용 쇼핑몰 구현이 궁금한 분

 

딱 13일간 제대로 가르쳐 드립니다. 한번 도전해보세요!

 

1. 강의 일정

개강일: 11월23일~1월2일(월수, 12일)

강의장: 그린컴퓨터아트학원 종로지점 - 212호

휴강일: 공휴일 휴무

교육시간: 오후 7시 ~ 오후 9:50    

문의: 02-722-2111

모집인원: 20명

2. 강의 내용

1 일차 디자이너의 피그마 활용


피그마 기본
- Adobe XD, sketch, Figma 비교
- 설치, UI 메뉴,  프레임
- 쉐이프, 클리핑 마스크, 펜툴, 폰트 위계
- 컴포넌트, 프로토 타이핑
2 일차 - UI 디자인 원칙
- 그리드

피그마 웹디자인 실무
- 버튼, 배너
3 일차 피그마 웹디자인 실무
- 배너, 서비스, 후기
- 푸터, 회사소개페이지
- 서브페이지, 아코디언
- 서브페이지, 회원가입, 로그인
4 일차
5 일차
6 일차 개발자의 피그마 활용
(쇼핑몰 디자인)






피그마 디자인 to HTML
- 인덱스 페이지
- 공통 HTML, CSS 작성

- INDEX페이지 CSS
7 일차 피그마 디자인 to HTML
- ABOUT 페이지
- 로그인
- 회원가입
- 반응형
8 일차 모바일 쇼핑몰 구현하기
- index 페이지 HTML, CSS, SCRIPT
9 일차 모바일 쇼핑몰 구현하기
- 상품목록페이지 HTML, CSS, SCRIPT
- 회원가입 HTML, CSS
10 일차 모바일 쇼핑몰 구현하기
- 회원가입 HTML, CSS
- INDEX ASIDE 애니메이션 HTML, CSS, SCRIPT
11 일차
12 일차
13 일차

모바일 쇼핑몰 구현하기
- 상품 상세 HTML, CSS, SCRIPT
- 장바구니 HTML, CSS, SCRIPT

(상기 일정은 학습 여건에 따라 변경될 수 있습니다.)

 

3. 대상

- 포토샵 또는 일러스트로 웹디자인을 한 경험이 있는 분 또는 없는분도 가능

  (포토샵, 일러스트레이터를 몰라도 피그마는 가능합니다.)

 

- HTML5 태그를 학습한 분

h1~h5, ul, p, a, input등 기본태그를 사용할 수 있다.

header, footer, aside등 HTML5 태그를 이해할 수 있다.

(기초 수업은 아닙니다. 태그를 하나하나 설명할 시간을 없을 수 있습니다. )

 

- CSS 기초를 학습한 분

  float, position, flex, 반응형 등을 학습한 분

(완벽하게 이해하고 있지 못해도 써본 경험이 있으면 됩니다. )

 

- Javascript, jQuery를 학습 한 분

변수, 함수, 배열, 이벤트을 이해할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- jQuery 라이브러리를 사용해본 경험이 있는 분

bxslider, slick, swiper, jQueryUI을 적용할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- 디자인에서 코딩까지 전체 프로세스를 경험해보고 싶은 분

 

4. 수업내용 미리보기

피그마 디자인 & 디자인 참고 웹페이지 구현하기

 

디자인 참고 웹페이지 구현하기

 

5. 문의

- 02-722-2111

- ezwebpub@gmail.com

- 상담 신청하기 https://forms.gle/59fkMTfehzVPEy2s7

 

피그마 활용 웹디자인 & 웹퍼블리싱 실무 신청

신청양식을 작성하여 제출해주시면 학원에서 전화상담을 통해 안내해드립니다. 개강일: 2022년 7월 12일 ~ (매주 화목금/화목) 강의장: 그린컴퓨터아트학원 종로지점 - 212호 휴강일: 공휴일 휴무

docs.google.com

6. 선행학습

- 코딩 파트는 html, css, javascript, jQuery 기초가 있어야 수업을 따라 오실 수 있습니다. 

제 유튜브 영상의 재생목록에서 아래 차시를 미리 학습해주시면 감사하겠습니다.

 

- HTML 재생목록 : HTML5-N01 ~ N21
- CSS 재생목록 : CSS3 - N01 ~ N10, CSS3-40, 41, 42
- Javascript : 01 ~ 10  
- jQeury : 01 ~ 13

7. 수강후기

 

반응형

https://youtu.be/VRTBq1U6AtU

 

여러분 주말시간을 활용하여 워드프레쓰 특강을 오픈하고자 합니다. 

과정 안내와 영상을 살펴 보시고 본문 하단 수강신청 버튼을 통해 신청해주세요. 감사합니다.

 

과정 목표

디자인을 참조하여 HTML, CSS, JAVASCRIPT를 활용하여 웹페이지를 구현한다. FLEX활용, 부트스트랩 V5를 활용하여 반응형을 빠르게 구현한다.

워드프레쓰 유료 또는 무료 테마를 사용하는 것이 아니라 codex.wordpress.org의 공식 매뉴얼을 통해 나만의 테마를 개발하고, 자신의 포트폴리오를 지속적으로 관리 홍보할 수 있는 웹페이지를 구현한다.

HTML파일로만 작성되어 관리 및 유지보수가 어려운 프로필 페이지가 아니라, 관리자 페이지에서 포트폴리오의 세부 정보를 등록하여 체계적으로 포트폴리오 작품을 관리한다.

 

WORDPRESS 소개

워드프레쓰는 컨텐츠를 등록 관리하는 시스템(CMS – content management system)중 전세계에서 가장 점유율이 높은 프로그램으로 다양한 테마와 플러그인을  활용하여, 블로그, 기업 홈페이지, 쇼핑몰, 도서관, 관공서등 다양한 웹사이트를 구현할 수 있는 무료 프로그램입니다.

[출처 https://w3techs.com/ ]

 

과정 상세

  • 1~2 일차 : Figma 디자인 참조 웹페이지 코딩하기 
  • 3일차: 워드프레쓰 테마의 구조 및 주요 파일 생성, 메뉴구현, 로그인 설정, 페이지 템플릿 생성
  • 4일차: 카테고리 생성 및 글 출력, 컨텐츠 등록 및 출력
  • 5일차: 검색페이지와 결과 페이지, 페이지네이션, 이전글, 다음글, 메일서버 활용하기, 플러그인 활용

    ** 수업진행시 학습속도에 따라 변동될 수 있습니다.

 

과정 결과물

[메인페이지]

[ 포트폴리오 페이지 – 카테고리 출력, 페이지 네이션 ]

[상세페이지- 컨텐츠 등록 출력, 이전글 다음글]

[ 컨텍 페이지 – 메일서버 활용, 폼생성 ]

수료생 샘플

 

대상

  • HTML, CSS, JAVASCRIPT, jQuery 경험자
  • php기초가 있거나, 없어도 무관

과정기간

  • 기간: 2022.10월 1일, 15일, 22일, 29일, 11월 12일(매주 토요일 총5일 25시간)
  • 시간: 오전 10 ~ 오후 4시 (오후1~오후2시 점심시간)
    **
    강의날짜와 시간 인원에 따라 변동될 수 있습니다.

교육장소

  • 대면: 그린컴퓨터 아트학원(종로점) 
  • 비대면: zoom 수업 가능
  • 주소 : 서울특별시 종로구 수표로 96 국일관 2F

정원

  • 온 오프라인포함 최대 20명
  • 신청자 5인 미만인 경우 강의는 오픈되지 않습니다.

수업료

  • 300,000원

 

문의

  • EZWEBPUB@GMAIL.COM
  • 주중은 수업중으로 문자나 카톡으로 실시간 문답은 힘들수 있습니다. 양해부탁드립니다.

수강료 반환 원인 및 기준

수강료 반환원인수강료 반환기준

교습개시 전 수강자의 귀책사유로 계약을 해제하는 경우 기 납부한 수강료 전액 환급
계약한 수강 개월이 1개월인 경우

(수강자의 귀책사유로 해지 시)
총 교습시간의 1/3 경과 전 수강료의 2/3 해당액 환급
총 교습시간의 1/2 경과 전 수강료의 1/2 해당액 환급
총 교습시간의 1/2 경과 후 환급하지 않음

 

참고 및 유의사항

  • 본 과정은 개인교습과정으로 그린컴퓨터아트학원의 공식 과정과는 무관합니다.
  • 개별 포트폴리오를 제작하는 과정은 아닙니다.
  • 워드프레쓰 테마 개발을 통해 프로필 페이지를 구현할 때 필요한 테크닉을 학습합니다.
  • 그린컴퓨터 아트학원은 강의실만 대관하는 형식입니다.
  • 본 특강 외에 그린컴퓨터 아트학원의 다양한 과정이 있으니 참고하시기 바랍니다.

수강신청하기

https://forms.gle/97Mqy54eAyuy6hXL9

반응형

안녕하세요. rocks'easyweb의 김동주 강사입니다.

 

피그마활용 웹디자인 & 웹퍼블리싱 강의를 그린컴퓨터아트학원(종로점)에서 재직자 수업(일반도 신청가능)으로 진행합니다.

강의는 오프라인으로 학원에 등원하거나 zoom을 통한 온라인 수강도 가능합니다.

 

하루 3시간, 총 약12일간 피그마를 활용한 웹디자인 기초와, 완성된 피그마 파일을 참조로 HTML, CSS, jQuery(javascript)등을 활용하여 웹페이지를 구현, 반응형 구현의 강의를 진행합니다. 또한 모바일 디자인을 참조하여 웹과는 다른 모바일의 환경에 최적화된 쇼핑몰을 구현합니다.

 

전반 5일은 디자인 파트는 디자인 초보자도 가능하지만, 7일간 코딩 파트의 강의내용은 html, css, script를 한번이라도 학습한 분을 대상으로 하기 때문에 기초가 부족한 분은 수업이 어려울 수 있습니다.

 

기초는 있지만 종합적으로 적용이 어려운 분,반응형이 힘든 분,모바일 전용 쇼핑몰 구현이 궁금한 분

 

딱 12일간 제대로 가르쳐 드립니다. 한번 도전해보세요!

 

1. 강의 일정

개강일: 7월19일~8월18일(화목금/화목, 12일)

강의장: 그린컴퓨터아트학원 종로지점 - 212호

휴강일: 공휴일 휴무

교육시간: 오후 7시 ~ 오후 9:50    

문의: 02-722-2111

모집인원: 20명

2. 강의 내용

1 일차 디자이너의 피그마 활용


피그마 기본
- Adobe XD, sketch, Figma 비교
- 설치, UI 메뉴,  프레임
- 쉐이프, 클리핑 마스크, 펜툴, 폰트 위계
- 컴포넌트, 프로토 타이핑
2 일차 - UI 디자인 원칙
- 그리드

피그마 웹디자인 실무
- 버튼, 배너
3 일차 피그마 웹디자인 실무
- 배너, 서비스, 후기
- 푸터, 회사소개페이지
- 서브페이지, 아코디언
- 서브페이지, 회원가입, 로그인
4 일차
5 일차
6 일차 개발자의 피그마 활용
(쇼핑몰 디자인)






피그마 디자인 to HTML
- 인덱스 페이지
- 공통 HTML, CSS 작성

- INDEX페이지 CSS
7 일차 피그마 디자인 to HTML
- ABOUT 페이지
- 로그인
- 회원가입
- 반응형
8 일차 모바일 쇼핑몰 구현하기
- index 페이지 HTML, CSS, SCRIPT
9 일차 모바일 쇼핑몰 구현하기
- 상품목록페이지 HTML, CSS, SCRIPT
- 회원가입 HTML, CSS
10 일차 모바일 쇼핑몰 구현하기
- 회원가입 HTML, CSS
- INDEX ASIDE 애니메이션 HTML, CSS, SCRIPT
11 일차
12 일차
모바일 쇼핑몰 구현하기
- 상품 상세 HTML, CSS, SCRIPT
- 장바구니 HTML, CSS, SCRIPT

(상기 일정은 학습 여건에 따라 변경될 수 있습니다.)

 

3. 대상

- 포토샵 또는 일러스트로 웹디자인을 한 경험이 있는 분 또는 없는분도 가능

  (포토샵, 일러스트레이터를 몰라도 피그마는 가능합니다.)

 

- HTML5 태그를 학습한 분

h1~h5, ul, p, a, input등 기본태그를 사용할 수 있다.

header, footer, aside등 HTML5 태그를 이해할 수 있다.

(기초 수업은 아닙니다. 태그를 하나하나 설명할 시간을 없을 수 있습니다. )

 

- CSS 기초를 학습한 분

  float, position, flex, 반응형 등을 학습한 분

(완벽하게 이해하고 있지 못해도 써본 경험이 있으면 됩니다. )

 

- Javascript, jQuery를 학습 한 분

변수, 함수, 배열, 이벤트을 이해할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- jQuery 라이브러리를 사용해본 경험이 있는 분

bxslider, slick, swiper, jQueryUI을 적용할 수 있다.

(기초수업은 아닙니다. 한번도 해본적이 없다면 이해하기 힘들수도 있습니다.)

 

- 디자인에서 코딩까지 전체 프로세스를 경험해보고 싶은 분

 

4. 수업내용 미리보기

피그마 디자인 & 디자인 참고 웹페이지 구현하기

 

디자인 참고 웹페이지 구현하기

 

5. 문의

- 02-722-2111

- ezwebpub@gmail.com

- 상담 신청하기 https://forms.gle/59fkMTfehzVPEy2s7

 

피그마 활용 웹디자인 & 웹퍼블리싱 실무 신청

신청양식을 작성하여 제출해주시면 학원에서 전화상담을 통해 안내해드립니다. 개강일: 2022년 7월 12일 ~ (매주 화목금/화목) 강의장: 그린컴퓨터아트학원 종로지점 - 212호 휴강일: 공휴일 휴무

docs.google.com

6. 선행학습

- 코딩 파트는 html, css, javascript, jQuery 기초가 있어야 수업을 따라 오실 수 있습니다. 

제 유튜브 영상의 재생목록에서 아래 차시를 미리 학습해주시면 감사하겠습니다.

 

- HTML 재생목록 : HTML5-N01 ~ N21
- CSS 재생목록 : CSS3 - N01 ~ N10, CSS3-40, 41, 42
- Javascript : 01 ~ 10  
- jQeury : 01 ~ 13

7. 수강후기

 

반응형

+ Recent posts