Inflearn brand logo image
Inflearn brand logo image
Inflearn brand logo image
NEW
개발 · 프로그래밍

/

웹 개발

합격을 부르는 웹 프론트엔드 포트폴리오 2025 (활용)

본 과정은 프론트엔드 웹 프로그래밍의 핵심 문법과 활용법을 학습하고, 이를 실제 포트폴리오 제작에 적용해 보는 실습 중심 강좌입니다. 학습자는 HTML, CSS, JavaScript 등 기초 문법부터 최신 프론트엔드 기술까지 단계적으로 익히며, 웹 화면 구현과 동적 기능 처리 과정을 직접 경험하게 됩니다. 또한 실무에서 자주 활용되는 다양한 예제를 통해 효율적인 코드 작성법과 실제 개발 흐름을 자연스럽게 습득할 수 있습니다. 이 과정을 통해 학습자는 단순한 문법 암기를 넘어, 웹 페이지 기획–디자인–구현까지 연결된 작업 흐름을 이해할 수 있으며, 이를 기반으로 자신만의 포트폴리오를 완성할 수 있습니다. 나아가 본 과정은 프론트엔드 개발자로 성장하기 위한 확실한 디딤돌이 될 것이며, 웹 개발을 처음 접하는 학습자에게는 입문 과정으로, 실무 경험을 쌓고 싶은 학습자에게는 실전 보완 과정으로 큰 도움이 될 것입니다.

1명 이 수강하고 있어요.

  • 유용한IT학습

이런 걸 배울 수 있어요

  • 다양한 프론트엔드 웹 프로그래밍 문법을 활용해서 UI를 구현해 나가는 과정입니다.

  • 주어진 예제를 온라인 강의를 통해 순차적으로 포트폴리오를 완성합니다.

합격을 부르는 웹 프론트엔드 포트폴리오 2025 (활용)

본 과정은 프론트엔드 웹 프로그래밍의 핵심 문법과 활용법을 학습하고, 이를 실제 포트폴리오 제작에 적용해 보는 실습 중심 강좌입니다.

학습자는 HTML, CSS, JavaScript 등 기초 문법부터 최신 프론트엔드 기술까지 단계적으로 익히며, 웹 화면 구현과 동적 기능 처리 과정을 직접 경험하게 됩니다. 또한 실무에서 자주 활용되는 다양한 예제를 통해 효율적인 코드 작성법실제 개발 흐름을 자연스럽게 습득할 수 있습니다.

이 과정을 통해 학습자는 단순한 문법 암기를 넘어, 웹 페이지 기획–디자인–구현까지 연결된 작업 흐름을 이해할 수 있으며, 이를 기반으로 자신만의 포트폴리오를 완성할 수 있습니다.

👉 나아가 본 과정은 프론트엔드 개발자로 성장하기 위한 확실한 디딤돌이 될 것이며, 웹 개발을 처음 접하는 학습자에게는 입문 과정으로, 실무 경험을 쌓고 싶은 학습자에게는 실전 보완 과정으로 큰 도움이 될 것입니다.

이런 내용을 배워요

🔹 섹션 1 : Part.1 템플릿 1

이 섹션은 하나의 템플릿 프로젝트를 완성하면서 프론트엔드 핵심 기술을 응용하는 과정을 다룹니다.

  • 헤더 인터랙션 구현을 통해 반응형 네비게이션과 다양한 UI 애니메이션을 학습합니다.

  • 슬라이더 기능을 SwiperJS 라이브러리를 활용해 직접 구현하며, 사용자 경험을 높이는 다이나믹한 페이지 전환 효과를 익힙니다.

  • 패럴렉스 구현을 통해 스크롤 기반의 입체적 효과를 실습, 실제 포트폴리오에 활용 가능한 수준의 인터랙션을 제작합니다.

  • React 환경에서 프로젝트를 구성하고, GSAP·SwiperJS 스크립트 작성을 연계하여 최신 프론트엔드 애니메이션과 UI 효과를 반영합니다.

  • 마지막으로 컴포넌트 구조 설계, 데이터 바인딩, Redux 상태관리를 적용해 실무와 동일한 방식으로 데이터를 다루는 방법을 익힙니다.

👉 이 과정을 통해 학습자는 단순히 기능 구현을 넘어서 현업 수준의 코드 구조와 상태관리 패턴까지 경험할 수 있습니다.

🔹 섹션 2 : Part.2 템플릿 2 (完)

두 번째 섹션은 보다 확장된 템플릿 프로젝트 2를 완성하며, 실무형 포트폴리오를 완결하는 단계입니다.

  • 헤더 인터랙션 구현(1~3)으로 다양한 UI 패턴을 경험하며, 스크롤·클릭·마우스오버 등 다양한 이벤트 처리 방식을 다룹니다.

  • 슬라이더와 패럴렉스 효과를 단계별로 구현해, 풍부한 사용자 경험(UX)을 제공하는 페이지를 설계합니다.

  • 컴포넌트 구조 작성(1~2)을 통해 복잡한 페이지도 모듈 단위로 나누어 효율적으로 관리할 수 있는 방법을 익히고,

  • UI 및 SwiperJS 스크립트 작성으로 라이브러리를 프로젝트에 최적화하는 방법을 실습합니다.

  • 이어서 데이터 바인딩과 Redux 상태관리를 학습해 규모 있는 프로젝트에서도 안정적으로 데이터 흐름을 제어할 수 있습니다.

  • 마지막으로 프로젝트 빌드 및 업로드 과정을 다루며, 실제 포트폴리오 사이트를 배포하는 전 과정을 경험합니다.

👉 이 섹션은 학습자가 단순한 실습을 넘어서, 완성도 높은 포트폴리오 프로젝트를 직접 배포 가능한 형태로 완성할 수 있도록 이끌어 줍니다.

수강 전 참고 사항

이 강의는 지식공유자의 질문/답변을 제공하지 않습니다

학습 자료

주차별 교안이 pdf파일로 제공됩니다

이런 분들께
추천드려요

학습 대상은
누구일까요?

  • JavaScript의 기본을 익히고 있는 학생들

  • JavaScript Library를 익히고자 하는 웹개발자

  • 실무에서 코딩 능력을 향상시키고자 하는 웹퍼블리셔나 웹개발자

안녕하세요
입니다.

8,256,039

수강생

6,086

수강평

4.6

강의 평점

261

강의

유용한 IT 강의를 통해 여러분의 성장을 돕겠습니다.

커리큘럼

전체

28개 ∙ (12시간 59분)

해당 강의에서 제공:

수업자료
강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!

얼리버드 할인 중 (5일 남음)

₩62

30%

₩114,400

유용한IT학습님의 다른 강의

지식공유자님의 다른 강의를 만나보세요!

비슷한 강의

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