inflearn logo
inflearn logo

A Comprehensive Summary of Web Frontend Basic Concepts Through Keywords and Hands-on Practice

A compass for web development beginners, this guide course helps you discover what you don't know about web frontend and move forward systematically.

강의소개.상단개요.수강생

난이도 입문

수강기한 무제한

Network
Network
Google Chrome
Google Chrome
Chrome DevTools
Chrome DevTools
Web Application
Web Application
Network
Network
Google Chrome
Google Chrome
Chrome DevTools
Chrome DevTools
Web Application
Web Application

강의상세_배울수있는것_타이틀

  • Understanding the relationships between the web, websites, webpages, and web browsers through the basic structure and concepts of the web.

  • Identifying the transition from traditional websites to modern web applications and its importance

  • Experience component-based development, the core of modern web applications.

  • Understanding the overall flow of web application development through the integration of web development tools and technologies

Studying Chrome DevTools
with ChatGPT ⚒️

Have you ever had these concerns?

🥲 I'm confused because the basic concepts related to the web are not well-organized.

🥲 I want to clearly understand the differences between web pages and web applications, as well as their operating principles.

🥲 I want to know how the network and web browser work together.

From theory to practice in just 1 hour! 📌

Chrome DevTools is a useful tool for web developers to debug and analyze web pages. In this course, you can learn general web concepts, web page creation, and the operating principles of web applications. You will systematically study foundational concepts such as the web, web pages, networks, web browsers, and web applications.

This developer tools course is conducted in a slightly different way. We will be working with ChatGPT based on key keywords. Take your first successful step into the world of the web by verifying how the theories you've learned actually work in practice.

How to solve your concerns 🛠️

  • We will systematically explain the basic concepts of the web.
  • I will help you directly experience the differences and operating principles through real-world examples of web pages and web applications.
  • We help you clearly understand each role through simple network tests and the principles of how web browsers operate.

After taking this course, you will 🌱

  • you will gain a deep understanding of various concepts related to the web.
  • By clearly understanding the operating principles of web pages and web applications, you will be able to develop effective problem-solving skills for real-world development.
  • By understanding the interaction between networks and web browsers, you will gain the technical knowledge necessary for building web-based services or applications.

Learning Content 📚

  • Concept of the Web: What is the web, the history and evolution of the web
  • Web Page: The structure and operating principles of a web page
  • Network: Basic network principles on how web pages are delivered to users
  • Web Browser: The role of the web browser in how it interprets and displays web pages
  • Web Applications: Interaction between server and client and the operating principles of web applications

Recommended for these people 🙆‍♀️

Beginners who want to learn various concepts about the web

Backend developers who want to gain basic knowledge of frontend

Designers or planners who need to communicate with the development team


Frequently Asked Questions 🧐

Q. Why should I learn the basic principles and operations of the web?

Understanding the basic principles and operations of the web is a great help in understanding the structure of websites or web apps. Through this, you can acquire the technical background knowledge necessary for web development.

Q. What can you do once you learn the basic principles and operations of the web?

You will understand the basic structure of websites and web applications, and by grasping the interaction between networks and web browsers, you will gain the fundamental knowledge necessary for building effective web services.

Q. Is this course suitable for non-majors?

Yes, the course is explained systematically from the basics to make it easy for non-majors to understand, so even those with no prior knowledge of the web can take it.

Q. Is there anything I need to prepare before taking the course?

No special preparation is required. However, having some basic web surfing experience will help you understand the course content more easily.

Q. To what level of depth does the course cover?

It covers the overall basic principles of how the web works, from basic web concepts to the operating principles of web pages and web applications, as well as the interaction between networks and web browsers.

Q. Are there any reference notes regarding the course (required environment, other precautions, etc.)?

Since the lectures are conducted on an online platform, a stable internet environment is required. No special software or tools are necessary, but you may need to install a web browser for the hands-on exercises.


Notes before taking the course 📢

Hands-on Environment

  • Operating System and Version (OS): Windows or macOS
  • Tools used: Chrome Browser Developer Tools and Chat-GPT

Prerequisite Knowledge and Important Notes

  • 웹을 공부하고 싶은 모두를 위해 어떤 걸 더 깊게 공부해야 할지를 찾기 위한 강의이므로 선수 지식은 없습니다.
    • However, if you encounter keywords you don't know, I recommend looking them up yourself rather than just passing over them.
  • 개발 초심자가 기초지식을 채우는 도구로 Chat-GPT만 한 게 없다고 생각합니다.
    • However, since ChatGPT may contain inaccurate information, it is recommended to cross-check with official documentation.

About the Instructor ✒️

I am currently working as an 8th-year web full-stack developer.

  • I build environments where fellow developers can create efficient and stable services.
  • I cover a wide range of technologies, including TypeScript, JavaScript, React, Next.js, Node.js, GraphQL, and ESLint.

I have served as a frontend developer mentor several times.

  • 👨‍👩‍👧‍👦 Programmers FE Dev Course 1st Cohort
  • ⛳ Couch Coding 6-week Portfolio Completion 9th~12th batches
  • ⛺ NAVER Connect Foundation Boostcamp 7th Generation

I have also created courses for frontend developers.

  • 🪄 코드스테이츠 교육 콘텐츠 제작
    • UI Library Development for Intermediate Developers (React Library Cloning)

And I continue to share the knowledge I have learned in the field.


강의소개.콘텐츠.추천문구

학습 대상은 누구일까요?

  • A beginner who wants to learn about various web-related concepts

  • A developer who has mainly focused on backend development but wants to gain basic knowledge of frontend.

  • People working as designers or planners who need basic frontend knowledge to communicate with development teams

강의소개.지공자소개

32,806

수강생

68

수강평

4.7

강의 평점

1

강의_one

IT Share is a group of experts that provides everything you need to know about IT roles.

커리큘럼

전체

7개 ∙ (강의상세_런타임_시간 강의상세_런타임_분)

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

수강평

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

비슷한 강의

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

강의상세_가격문구_비공개