이젠아카데미DX교육센터 종로 - 생성형 AI(챗 GPT)를 활용한 프론트엔드 개발

생성형 AI(챗 GPT)를 활용한 프론트엔드 개발

1차 개강일
24년 11월 26일(화)
2차 개강일
24년 12월 10일(화)

고용24 국민내일배움카드 훈련과정명은
생성형 AI(챗 GPT)를 활용한 프론트엔드 개발입니다.

교육기간
정규 6개월 직장인/초보자/비전공자
수강료

국비지원 교육비 0원

K-디지털 트레이닝 전액지원

취업분야
프론트엔드개발자, 스타트업, 소프트웨어개발/서비스, IT/인공지능,
앱/웹서비스, 온라인플랫폼, 온라인쇼핑몰, 온라인커머스, 웹디자인,
웹퍼블리셔, UIUX디자이너

지금 신청하면 모든 온라인강의0원이라고?

간편 회원 가입만으로도 1400만원 상당의 온라인 강의가 0원

2개월 프리패스 제공
0원 강의
안내받기

WHY?
UXUI 웹·프론트엔드 개발 부트캠프
(생성형AI 챗GPT 활용)으로
시작해야 할까요?

피그마를 통한 UI/UX 디자인 역량 강화 + React를 활용한 인터랙티브한
웹 애플리케이션 개발 + Node.js로 서버 사이드 로직까지 처리 할 수 있고,
UI/UX 디자인과 개발을 모두 아우르는 역량을 갖춘
프론트엔드 개발자 채용시장에서 뽑히는 개발자로 성장합니다.

Start now

프론트엔드 개발,
왜 배워야 할까요?

개발자로의 시작하기에 진입장벽이 낮고,
웹과 모바일 애플리케이션의 수요가 꾸준히 증가함에 따라
프론트엔드 개발자에 대한 수요도 매우 높으니까!

프론트엔드
개발자

  • 프론트엔드개발자는
    전공과 경력보다
    실력 위주 채용!
  • 기초가 부족해도
    진입장벽이 낮아
    개발자로 시작하기 좋음
  • 중요한 사용자 경험(UX)에
    직접적인 영향을 미치고
    있어
    기업에서의
    중요성이 높음
  • 프론트엔드 채용공고
    2700건 이상으로
    높아지는 수요에
    취업 가능성 높음

    *사O인 프론트엔드 개발자 공고 기준

채용공고에서 프론트엔드 개발자 수요는
점점 증가하고 있습니다.

UIUX 웹·프론트엔드 개발 부트캠프
(생성형AI 챗GPT 활용)
어떻게 진행되나요?

  1. 사전 수업 스타트 캠프개념 형성 학습
    프론트엔드 기초 선행학습
  2. 정규 부트 캠프 적용/발전 (생성형 AI 활용)
    프론트엔드 실전 + 미니 프로젝트
  3. 프로젝트 실전 5인 1개조 협업 프로젝트
    현직 개발자 협업 프로젝트 진행
  4. 취업 성공 캠프 취업 성공
    협력 기업 매칭

스터디크루(현직 개발자 튜터링/멘토링 + 스터디 그룹)

사전 수업 스타트캠프
기초 지식이 없어 혼자는 막막하다면?
UXUI디자인·프론트엔드 개발의 시작,
사전 수업 스타트 캠프 운영으로 걱정 No!

디자인/코딩 기초가 없는 학생들을 위해 사전 교육을 제공하여
프로그래밍의 기본 개념과 사전학습을 통해 탄탄한 기초를 쌓고,
이를 바탕으로 프론트엔드 개발 시작을 든든하게 지원합니다.

기초 언어 이해 속도

  1. PreClass
    1차
    1차 (온라인)
    • IT용어집 제공
    • Html, CSS 기초 수업(2주)
    • KDC 피그마(1~4주)
  2. PreClass
    2차
    2차 (오프라인)
    • Html 기초 입문
    • CSS 기초 입문 / Javascript의 이해
    • 실무예제(부트스트랩 활용) 페이지 작성
  3. Regular
    Class
    3차 (오프라인)
    • 동기부여 2주 집중 보충수업
    • 학습 스터디 크루
    • 수준별 튜터링

정규 수업 부트 캠프
실무에 적응할 정도의 코딩 수준이 될까 걱정이라면?
체계적인 정규 수업 부트캠프로
문제 해결(실무) 능력 업그레이드!

  1. 제대로 만든
    Curriculum을 배웁니다.

  2. 좋은 개발자의 핵심
    실무 역량(문제해결역량) UP!

    팀 프로젝트 진행 생성형 AI 활용

  3. 혼자는 어렵지만, 함께하면
    빨라지고 쉬워집니다.

    • 사용자 맞춤 설계가 자유롭고
      브랜드 심미성을 살린 디자인
    • 코드가 명확하고 이해하기 쉬운 코드
    • 변경과 확장이 용이한 코드, 모듈화 할 수 있는 코드

    당신의 UX·UI 디자인 & 코드
    퀄리티가 달라집니다.

프론트엔드 개발에서
왜 생성형 AI(챗GPT)를 활용 해야 할까요?
  1. UX·UI 디자인 & 코드 작성 및 문제해결이 더 빨라지고 효율적으로 진행
    ChatGPT 활용전

    색상 부조화로 브랜드 심미성을 잘 살리지 못해 가치를
    떨어트렸고, 사용자 맞춤 설계에 제한적이였습니다.

    ChatGPT 활용 후

    디자인의 영감과 심미성을 고려한 색상을 추천받아
    가치를 올리고, 개인화된 디자인 제안이 가능하게 됩니다.

    UX·UI 디자인에 생성형 AI를 활용 하면 좋은 이유!
    • 데이터 리서치 빠른 정보 검색 및 분석 후 효율적으로 정리합니다.
    • 사용자 플로우 다양한 사용자 시나리오 제공하여,
      UX 개선을 위한 영감을 얻을 수 있습니다.
    • 경쟁사 분석 많은 시간이 필요한 경쟁사 웹사이트 및 마케팅 전략까지 빠르게 분석해 줍니다.
    • UX 결함 개선 A/B 테스트 아이디어 제안합니다.
    • 영감 및 색상 디자인의 영감이나 브랜드 가치의 심미성을
      고려한 색상 조합을 추천합니다.
    ChatGPT 활용전

    이중 for루프는 배열을 순차적으로 비교하므로
    이해는 쉽지만, 큰 배열에서는 비효율적입니다.

    ChatGPT 활용 후

    Set 객체의 중복을 허용하지 않는 특성을 활용하여
    배열을 Set으로 변환하면 간단히 중복을 제거할 수 있습니다.

    최적화 코드 작성하면 좋은 이유!
    • 성능 향상 실행 속도가 빨라지고 메모리 사용이 줄어듭니다.
    • 가독성 증가 간결해져 이해하기 쉽고 유지보수가 용이합니다.
    • 에러 감소 복잡성을 줄여 버그 발생 가능성을 낮춥니다.
    • 재사용성 모듈화되어 다른 프로젝트에서 재사용이 쉽습니다.
    • 협업 용이 깔끔한 코드는 팀원들과의 협업을 원활하게 합니다.
  2. 최신 트렌드, 베스트 프랙티스 학습생상선을 향상

    UX·UI 디자인 & 프론트엔드 학습 중 마주하는 어려움들,
    ChatGPT와 함께라면 더 이상 막막하지 않아요!

    1. 디자인 및 코드 오류 발견의 어려움 - 약 80%

      UX의 결함, 코드 오류메세지의 난해함과
      디버깅 겸험 부족으로 학습중 막막함을 느낍니다.

      오류의 원인과 해결 방안을 빠르게 분석하여
      반복적 오류 발생을 줄입니다.

    2. 프레임워크 학습의 어려움 - 약 70%

      개념의 복잡성과 , 다양한 선택지 등
      정보를 쉽게 찾기 어려워 혼란을 겪기도 합니다.

      프레임워크의 복잡한 개념과 단계별
      학습을 돕습니다.

    3. 성능 최적화의 어려움 - 약 60%

      복잡한 원인 분석과 경험 부족으로 디자인과 코드가
      복잡해지고,
      제한된 시간 내에 최적화를 진행하기
      어려워집니다.

      구체적인 최적화 방법 제시로 효율적이게
      문제해결을 돕습니다.

    80%

    학습효과
    60%
    UP!

    70%

    학습효과
    50%
    UP!

    65%

    학습효과
    45%
    UP!

    ChatGPT 활용 이래도 안할꺼야?
    UX결함? 오류 메시지? 바로 해결!
    디버깅 시간 단축? 문제없지!
    리서치, 경쟁사분석? 변수 undefined 문제까지?
    ChatGPT활용하면 문제 없지!

UX·UI 디자인 & 프론트엔드 개발은
빠르게 변화하는 분야로, 이와 같이 챗GPT를 활용하면
다양한 문제를 빠르게 해결하고, 최신 트렌드를
습득
하며, 생산성을 크게 향상시킬 수 있습니다.

기업에 뽑히는 프론트엔드 개발자는
어떤 프로젝트를 할까요?


기업 채용공고를 보면
알 수 있습니다.

JOB사이트 채용공고
모집내용 을 바탕으로 한 동일한 교육

  • 코스닥 상장자 (주)엑*
    UIUX 사용자 기능 개발
    Node.js 사용 경험자
  • (주)포*메모리
    React 프레임워크 필수
    HTML, CSS 깊은 이해
  • (주)티*
    React 프레임워크 개발 익숙 AWS 서비스 활용 경험


커리큘럼

  1. 디자인과 개발, 유연한 사고
    피그마를 통한 UX/UI 강화
  2. 웹 애플리케이션 개발
    React 활용
  3. 서버 사이드 로직
    Node.js 사용 경험
  4. 실전 5인 1개조 협업 프로젝트
    520시간 프로젝트 경험
    *미니프로젝트 포함

UX·UI 디자인 설계ReactNode.js 실전 협업 프로젝트 경험을 하는 순간 프론트엔드 개발자로 뽑힐 경쟁력을 갖게 됩니다.

Curriculum
  1. 개발환경 구축 & UX·UI 디자인
    비쥬얼스튜디오, 깃, 피그마
  2. 프론트엔드 기초
    HTML5, CSS3, JS, Type Script
  3. 프론트엔드 응용
    React, Node.js
  4. 클라우드 활용
    ChatGPT, AWS
  1. Setup&
    Design

    개발 환경 설정과 협업 도구 활용법을 배우고,
    UX·UI 디자인 설계의 기본 개념과
    프로토타입 제작을 학습합니다.

    1. 환경 설정 및 UX/UI 설계 개발 환경과 협업 도구에 대한 기본 이해와

      VS Code 설치 및 Git/GitHub 활용을 학습합니다.

      • Lv.1 (초급)
      • GitHub 가이드
    2. UX/UI 설계 (Figma) UX/UI 설계의 기본 개념과 사용자 분석,
      와이어프레임 및 프로토타입 제작 등 학습합니다.

      • Lv.1 (초급)
      • 피그마 활용 가이드
  2. 프론트엔드
    기초

    프론트엔드 기본 지식을 활용하여
    실전 프로젝트에서 UX·UI 설계와
    HTML/CSS 기반의
    반응형 웹디자인을 구현합니다.

    40시간
    미니
    프로젝트
    1. UX/UI 실전 활용 OTT 서비스의 UX/UI 설계 및 사용자 조사,
      페르소나, 워크플로우 및 프로토타입을 제작합니다.

      • Lv.1 (초급)
    2. HTML/CSS HTML/CSS 기본 문법 및 웹 레이아웃 구현과
      반응형 웹디자인 및 미디어쿼리를 활용합니다.

      • Lv.1 ~2 (초·중급)
      • 디바이스별 가이드
    3. 미니프로젝트 I - UX/UI 설계

      • OTT Service UX/UI 설계
        User research
        Persona / Journey map
        Workflow / Wireframe
        UX/UI Guide
        Prototype
      • 팀 프로젝트 (초급)
  3. 프론트엔드
    심화

    프론트엔드 개발 역량을 심화
    (JavaScript, TypeScript, React)
    하고, 실전 프로젝트에서 웹/모바일
    애플리케이션을 구현합니다.

    60시간
    미니
    프로젝트
    1. JavaScript & TypeScript JavaScript와 TypeScript의 기본 개념,
      동작 원리,
      비동기 처리, DOM 조작, 및
      주요 문법과 자료형을 학습합니다.

      • Lv.2 (중급)
    2. React/ReactNative 웹/모바일 퍼블리싱을 위한 HTML/CSS와
      JavaScript 활용 및 React/ReactNative를
      통한
      애플리케이션 개발을 실전 활용합니다.

      • Lv.2 ~3 (중·고급)
    3. 미니프로젝트 II - 퍼블리싱및 구현

      • OTT Service 웹/모바일 퍼블리싱 구현
        HTML / CSS 활용 웹/모바일 퍼블리싱
        문서내 동적 기능 구현 Javascript 작성
        Javascript & Dom을 활용한 UI 구현
        Javascript를 활용한 애니메이션 UI 구현
      • 팀 프로젝트 (중급)
  4. SPA /
    클라우드 AI

    프론트엔드 개발을 위한 SPA 구현,
    클라우드 배포 및 관리, 그리고
    생성형 AI(chatGPT)를 활용한
    프로젝트 기획과 코딩 기술을
    다룹니다.

    60시간
    미니
    프로젝트
    1. 프레임워크활용 및 배포 Node.js와 Express로 SPA 개발,
      MongoDB 연동 및
      AWS 배포, Webpack과
      MVVM 패턴을 활용한
      사이트를 구현합니다.

      • Lv.3 (고급)
    2. 클라우드 및 AI 활용 AWS 클라우드 인프라 활용과 chatGPT를 통한
      프로젝트 기획 및 코딩 기술을 습득합니다.

      • Lv.3 (고급)
    3. 미니프로젝트 III - SPA 구현

      • OTT Service 웹/모바일 프론트엔드 개발
        웹/모바일 프론트엔드 개발
        Webpack을 활용한 SPA 구현
        MVVM 패턴을 활용한 SPA 사이트 구현
      • 팀 프로젝트 (고급)
  5. 프로젝트

    협업능력과 아이디어 선정기법,
    스킬 업그레이드를 중점으로
    웹/앱 형태로 구축합니다.서비스를 배웁니다.

    360시간 프로젝트
    With 현직 개발자
    1. OTT Service 웹/모바일 프로젝트 I

      • Youtube Site 프로젝트 개발
      • Tiktok SNS Service 프로젝트 개발
        프로젝트 기획 및 제작, 웹/모바일 퍼블리싱,
        Page 동적 가능 구현 (chatGPT 활용),
        Express 프레임워크 활용 Server 구현,
        Router / URL Parameters 활용 Pagenation,
        MongoDB & Mongoose 활용, DB 테이블 Setting
      • 팀 프로젝트 (고급)
      • 유튜브/틱톡
    2. Tiktok SNS Service 프로젝트 II

      • E-commerce Shopping mall (쿠팡)
      • E-commerce Shopping mall (11st)
        프로젝트 기획 및 제작, 웹/모바일 퍼블리싱,
        Page 동적 가능 구현 (chatGPT 활용),
        Private Route & Token verify 활용,
        장바구니 상품정보 관리 (Redirect),
        Token 활용 Google, Git Hub 등 외부 로그인 구현
      • 팀 프로젝트 (고급)
      • 쿠팡/11번가

520시간 (미니 프로젝트 포함)
성장의 결과,
수강생들이 완성한 팀 프로젝트입니다.

당신도 현직 실무자 이상의
프로젝트 결과물을 만들어낼 수 있습니다.

스터디 크루
열정 200% 수강생들의 모임
함께 성장하여 즐거운 스터디 크루와
전문 튜터의 든든한 지원!

서로의 평가와 피드백에 자극 받으며,
커뮤니티안에서 더~욱 성장하는게 느껴집니다. 프론트엔드 부트캠프 수강생, 이O경님

여러분의 성장을 돕기 위해 스터디 크루를 운영합니다.
동료들과 함께 학습하고,
서로의 지식을 공유하여 끊임없는 동기부여를 받습니다.

  • 스터디 크루(커뮤니티) 운영

  • 현직 개발자 튜터(마스터)링

  • 혼자 너무 막하는 부분이 있을 때
    튜터님의 도움을 받아 빠르게 해결했어요.

    프론트엔드 부트캠프 수강생, 김O진님

  • 튜터님의 실무적인 경험이 바탕이 된
    현실적인 조언 덕에 빠르게 성장할 수 있었어요.

    프론트엔드 부트캠프 수강생, 박O우님

  • 의지가 약해 혼자는 절대 못했을 텐데
    튜터님 덕에 지속적으로 스스로에게
    동기부여가 됐어요!

    프론트엔드 부트캠프 수강생, 신O헌님

  • 현직자 튜터는 다르네요.
    내 코드에 대해 빠르게 파악하고,
    빠른 피드백을 받을 수 있어요.

    프론트엔드 부트캠프 수강생, 김O혜님

스터디 크루와 전문 튜터의 가이드로
혼자서는 어려운 코드를 쉽게 익히고,
가파른 성장을 이룰 수 있습니다.

빠르게 변하는 프론트엔드 개발
트렌드에 맞춘
취업 성공 캠프로,
취업성공률이 달라집니다.

  • 취업 성공률 현황

  • 이젠아카데미 평균 개발자 취업률 78.3%

프론트엔드 이력서의 중요한 포인트는 바로 ‘프로젝트’
  • 선호하는 프론트엔드 개발자 웹사이트 형식의 포트폴리오부터 노션, 깃허브, PDF 파일 등
    다양한 방식으로 제작하는법
  • 여러 이력서 중 나의 이력서를 선택하게 만드는 방법
  • 강점을 효과적으로 어필하고, 약점을 보완하는 방법까지 구체적으로 1:1 컨설팅
프론트엔드 구인공고 공유 및 인재 추천
  • 이젠아카데미 협약기업(프로젝트 같이 진행한 기업 포함) 및 기업 구인내용을 확인하여
    개인별 맞는 기업을 매칭하여 취업 합격률 UP
실전 면접 준비 및 면접 진행
  • 개발적 역량과 인성을 잘 어필 할 수 있도록 1:1 멘토링 진행
  • 예상 질문과 예상치 못한 질문에서 대처하는 방법을 익히도록 1:1 모의 면접 진행
  • 모의 면접 후 전문가의 피드백을 통해 개선점 파악 후 면접까지 진행
  • 커리어 패스타 진행

  • 면접자가
    좋아하는
    이력서와 프로젝트에 대해
    알게 되었어요!
    프론트엔드 부트캠프 수강생,
    전O준님

  • 현직 프론트엔드
    개발자한테 직접 들으니
    너무 많은 도움이
    됐어요!
    프론트엔드 부트캠프 수강생,
    이O혜님

개발자 취업 최신 동향, 채용과정의 주의할 점,
성공적인 취업 전략등의 커리어 페스타가 진행 됩니다.

당신도! 지금 시작하면
개발자로 성장하여 취업에 성공할 수 있습니다.

수강후기

  • 인천 스마트팩토리
    - 김○주

    어려운 과정이지만 배제민 강사님께서 잘 이끌어주셔서 배우는데 크게 무리 없었습니다!

  • 인천 스마트팩토리
    - 황○희

    카티아 과정을 찾던 중 요즘 뜨고 있다는 스마트 팩토리를 상담받게 되었고 이왕 배우는거 폭 깊게 배우는것이 좋을 것 같다는 생각이 들어서 수업을 듣게 되었습니다. 배제민 강사님께서 친절하게 차근차근 알려주셔서 큰 어려움없이 들을 수 있었습니다.

  • 인천캠퍼스 aws
    - 이○홍

    처음 배우는 과정이라 생소하고 어려웠지만 박상진 강사님이 친절하게 잘 이끌어주셔서 수업 잘 들을 수 있었습니다.

  • 인천점 aws 리뷰
    - 조○진

    웹 디자이너로 근무하다가 웹 개발자로 이직하고 싶어서 상담을 받고 박상진 선생님 수업을 듣게 되었습니다. 심화 된 과정이라 초반에는 어려움이 있었지만 선생님이 잘 이끌어주셔서 끝까지 수업 유익하고 재미있게 마칠 수 있었습니다!

  • 인천 스마트팩토리
    - 강○라

    스마트 기술을 전목시킨 과정이라서 새롭고 재밌었습니다. 배제민 선생님이 친절하고 쉽게 알려주셔서 더욱 더 좋았습니다!

  • 인천캠퍼스 스마트팩토리
    - 이○영

    전공으로 카티아를 배웠는데 요즘에 스마트팩토리가 뜨고 있다고 들어서 과정을 찾던 중 이젠에서 과정이 개설한다기에 상담을 받고 수업을 들었습니다. 배제민 선생님이 어려운 부분도 쉽게 풀어서 설명해주시고 자료들도 제공을 해주셔서 배우는 동안 재미있게 수업 마칠 수 있었습니다.

  • 인천 aws 리뷰
    - 신○기

    개발자 과정이라 배울것도 많고 어려운 부분도 있었지만 박상진 선생님이 적응 할수 있도록 잘 이끌어주셨습니다!

  • 인천캠퍼스 aws 과정
    - 김○진

    aws 클라우드를 활용하는 풀스택 과정이 있다고 해서 듣게 되었는데 처음에는 비전공자라 생소하고 어려운 면도 있었지만 박상진 강사님께서 자료도 많이 주시고 꼼꼼히 봐주셔서 덕분에 즐겁게 수업 듣고 마칠 수 있었습니다 :)

  • 인천캠퍼스 스마트팩토리
    - 김○리

    스마트 팩토리가 생소한 분야 였지만 취업 준비를 위해 들었습니다 배제민 강사님 덕분에 어렵지 않게 잘 들을 수 있었습니다 감사합니다!

  • 인천점 스마트팩토리
    - 이○영

    인천에서 스마트팩토리를 찾던 중 이젠에 과정이 있다는 소식을 듣고 상담 받고 수강하게 되었습니다. 배제민 강사님이 기초적인 부분부터 차근차근 알려주셔서 큰 어려움 없이 수료 할 수 있었습니다! 이직 준비하는 기간동안 도움을 많이 주셔서 감사합니다

 
개강일까지
🔥 D-5 경쟁력 갖춘 실무자로 성장 교육비 O원(국비지원)

10초 안내받기

원하시는 과정을 선택하시면 1:1 상담을 진행해드립니다.

지점선택

학과 및 교육과정 선택

지점을 선택해 주세요.

신청자

빠른 안내 전화 문의 02)733-8781
개인정보수집 및 이용에 대한 동의

(주)이젠아카데미가 운영하는 이젠아카데미컴퓨터학원 및 계열 브랜드 웹&모바일 사이트에 대하여 상담 및 이용자가 원하는 서비스를 충족시키기 위해 아래와 같은 개인정보를 수집하고 있습니다.

1. 수집하는 개인정보 항목 및 수집방법
(1) 수집항목
필수: 캠퍼스, 상담과목, 이름, 전화번호
선택입력: 아이디, 생년월일, 성별, 제목, 내용, 사진 등
(2) 개인정보 수집 방법 : 웹&모바일 홈페이지(온라인상담신청, 수강료조회, 내일배움카드제(계좌제)조회, 고용보험환급, 재직자국비과정조회, 시간표조회, 지점별 위치조회, 위탁교육문의 등), 서면양식 외


2. 수집한 개인정보의 이용
(1) 이용자가 제공한 모든 정보는 교육 서비스 제공, 이벤트 안내 등 필요한 용도로만 사용되며, 목적이 변경될 시에는 사전에 동의를 구합니다.


3. 개인정보의 보유 · 이용기간 및 폐기
모든 검토가 완료된 후 5년간 이용자의 조회를 위하여 보관하며, 이 후 해당정보를 지체없이 파기합니다.


4. 동의를 거부할 권리가 있다는 사실과 동의 거부에 따른 불이익 내용
이용자는 (주)이젠아카데미가 운영하는 컴퓨터학원 및 계열 브랜드 웹&모바일 사이트에서 수집하는 개인정보에 대해 동의를 거부할 권리가 있으며 동의 거부 시에는 회원가입 및 인터넷 수강료 조회, 온라인 상담 등의 홈페이지 서비스가 일부 제한됩니다.

그 밖의 사항은 <개인정보 처리방침>을 준수합니다.