강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Front-end

Masterclass in developing portfolio sites using various frameworks

Learn how to build a beautiful portfolio site using Vite, React, Vue, and Next.js. Perfect for developers looking to improve their practical front-end development skills using multiple frameworks.

(5.0) 1 reviews

32 learners

  • webstoryboy
포트폴리오
Portfolio
React
Vue.js
vitejs
Next.js

What you will learn!

  • Portfolio using JavaScript development tool Vite

  • How to create a portfolio using Next.js

  • How to create a portfolio using Vue.js

  • How to create a portfolio using React.js

Creating a front-end portfolio and
Learn the framework all at once!

From framework basics to application
Real-World Web Portfolio Creation

  • Create a stunning portfolio site using various frameworks such as Vite, React,js Vue,js Next.js, etc.
  • You can experience real-world projects that will develop the skills needed to become a front-end developer.

While making it myself
Develop your development skills!

The goal of this course is to enhance your skills as a front-end developer by leveraging various frameworks and to build a compelling portfolio site through practical projects.

The goal of this course is to help you master various tools, learn from the basics to the application of each framework, gain practical experience in web development, and develop your skills. Let's take on the challenge together!

Because it covers multiple frameworks, including Vite, React, Vue, and Next, you can compare and experience various frameworks.

By creating a high-quality portfolio yourself, you can learn and experience not only theoretical content but also practical production methods.

Leverage cutting-edge web development tools like Vite and Next.js to optimize your development environment and develop web applications efficiently.

You can learn vividly!

  • ✅ Implement landscape mode using GSAP.
  • ✅ Implement smooth effect using Lenis.
  • Responsive design and web standards and accessibility are taken into consideration.
  • Optimize your site and improve efficiency using the JavaScript framework Vite.
  • ✅ We create sites using React and complete components and deployment .
  • ✅ Create and deploy a site using Views.
  • ✅ Build and deploy a site with Next.js.
  • ✅ Convert CSS to SCSS and work with it.
  • ✅ We help you work on your personal portfolio.

Q&A 💬

Q. What are the pros and cons of each framework?

React is a flexible and powerful component-based library with a large community and ecosystem.
Vue.js is an intuitive, lightweight framework with a gentle learning curve.
Next.js supports server-side rendering (SSR) and code splitting, making it great for SEO-related processing.

Q. Which framework is best for creating a portfolio?

Depending on your project's objectives and requirements, the appropriate framework may vary. Choose the right framework based on its unique features.

Q. Will it be difficult to learn each framework?

Beginners may find it difficult to learn the concepts and ecosystem of the framework, but it can be easily overcome as you will learn one site four times.

Q. What prerequisite knowledge is required for front-end development?

Basic knowledge of HTML, CSS, and JavaScript is required, and understanding the fundamental concepts of the framework will help you learn quickly.

Q. What is the most important point when creating a portfolio site?

User experience, design, layout composition, and performance optimization are key factors in creating a portfolio site. Content-wise, it's important to showcase your knowledge and capabilities.

Q. How difficult is it to implement the portfolio covered in the lecture?

Create a portfolio with a range of difficulty levels, from beginner to intermediate. Learn everything from the basics, including working with CSS using SCSS and applying GSAP, to building various frameworks.

Q. What learning methods and materials will I receive if I take the course?

The first problem that causes people to give up on lectures is that they're the only ones who can't. If the instructor is good, but you're the only one who can't, this can be a challenge for beginners. To help overcome this problem, we provide a tutorial blog . You can refer to it while taking the lecture and, by checking it when you make a typo, reduce your mistakes.

Q. Are there any examples of projects covered in the lecture?

All lecture sources are distributed on Github and Netlify . Of course, we'll also share them during class.

✅ Please note before taking the class

  • Basic knowledge of HTML, CSS, and JavaScript is required for this course. Furthermore, prior knowledge of each framework will facilitate learning.
  • A self-directed learning attitude and a willingness to take on practical projects are required.

Recommended for
these people

Who is this course right for?

  • Intermediate front-end developer who wants to learn various frameworks

  • Students and job seekers who want to create a portfolio site

  • Beginners who want to learn front-end development

  • Experienced developer who wants to strengthen their portfolio as a front-end developer

Need to know before starting?

  • HTML, CSS, JavaScript

Hello
This is

124

Learners

6

Reviews

6

Answers

5.0

Rating

4

Courses

나는 공간을 만드는 것을 좋아한다.
어렸을 때부터 나만의 공간을 만드는 것을 좋아했다. 
내가 만든 공간 속에서 누군가가 영감을 받거나 마음을 움직이게 하는 것이 목표다.
코딩은 이런 매력적인 공간을 만들 수 있는 힘이라 생각한다. 
그 한구석에 나만의 꿈을 담아두고, 개발을 하면 살고 싶다.

Curriculum

All

40 lectures ∙ (13hr 32min)

Published: 
Last updated: 

Reviews

All

1 reviews

5.0

1 reviews

  • designshake8524님의 프로필 이미지
    designshake8524

    Reviews 1

    Average Rating 5.0

    5

    18% enrolled

    Tốc độ của bài giảng hơi nhanh nhưng tôi nghĩ mình cần phải xem ít nhất ba lần để cảm nhận được.

    $51.70

    webstoryboy's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!