웹 5의 빌딩 블록

웹 개발 여정을 시작하는 경우 웹의 "방법"과 "이유"를 파악하는 것은 HTML, CSS 또는 JavaScript를 배우는 것만큼 중요합니다.

웹 개발을 시작하는 데 필요한 모든 필수 지식을 얻을 수 있습니다.

인터넷은 어떻게 작동하나요?

인터넷은 웹의 중추이자 웹을 가능하게 하는 기술 인프라입니다. 가장 기본적으로 인터넷은 모두가 함께 통신하는 대규모 컴퓨터 네트워크입니다.

"인터넷이 어떻게 작동하는지" 상세 영상

웹 기초: 2024년 웹 구성 요소 가이드

웹은 극적으로 발전했지만 디지털 세계를 이해하거나 구축하려는 모든 사람에게 웹의 핵심 원칙은 여전히 ​​필수적입니다. 이 가이드는 기본 정의부터 최신 온라인 경험을 지원하는 기술까지 웹의 기본 개념을 자세히 설명합니다.

1. 월드와이드웹(WWW): 상호 연결된 정보 시스템

월드 와이드 웹은 간단히 웹이라고도 불리며 서로 연결되고 인터넷을 통해 액세스할 수 있는 상호 연결된 문서와 리소스로 구성된 방대한 시스템입니다. 기본 네트워크 인프라). 전 세계적으로 정보가 공유되고 액세스되는 거대한 도서관이라고 생각하세요.

• 주요 구성 요소:
  • 리소스: 웹 페이지, 문서, 이미지, 비디오 및 기타 디지털 콘텐츠 등 웹의 구성 요소입니다.
  • URL(Uniform Resource Locator): 웹페이지의 거리 주소와 같이 각 리소스를 식별하는 고유 주소(예: https://www.example.com/about)
  • HTTP/HTTPS(Hypertext Transfer Protocol): 웹 브라우저와 서버가 정보를 교환하는 방법을 제어하는 ​​통신 규칙(프로토콜)입니다. HTTPS는 암호화를 통해 보안 계층을 추가합니다.
  • 웹 서버: 웹 리소스를 저장하고 제공하는 컴퓨터
  • 웹 브라우저: 사용자가 웹 리소스에 액세스하고 상호 작용할 수 있게 해주는 소프트웨어 애플리케이션(예: Chrome, Firefox, Edge)

2. 웹 페이지, 웹 사이트, 웹 앱: 차이점 이해

• 웹 페이지: 일반적으로 HTML로 작성되어 텍스트, 이미지, 비디오 및 기타 미디어를 표시할 수 있는 단일 문서입니다.
• 웹사이트: 일반적으로 단일 도메인 이름으로 서로 연결되는 관련 웹페이지 모음입니다. 여러 장으로 구성된 책이라고 생각하세요.
• 웹 앱(웹 애플리케이션): 데스크톱 또는 모바일 애플리케이션과 유사한 기능을 제공하는 보다 대화형이고 동적인 유형의 웹사이트입니다. 예로는 Gmail, Google Docs 및 다양한 최신 소셜 미디어 플랫폼이 있습니다. 웹 앱은 종종 JavaScript 프레임워크 및 API와 같은 고급 기술을 활용하여 풍부한 사용자 경험을 제공합니다.

3. 웹 페이지 구축: HTML, CSS, JavaScript의 세 가지 요소

웹페이지 제작에는 세 가지 핵심 기술이 필요합니다.

• HTML(하이퍼텍스트 마크업 언어): 기초. HTML은 제목, 단락, 이미지, 링크와 같은 요소를 정의하여 웹 페이지의 구조와 콘텐츠를 제공합니다. 마치 건물의 뼈대와 같습니다.
• CSS(Cascading Style Sheets): 스타일리스트. CSS는 색상, 글꼴, 레이아웃, 반응성(페이지가 다양한 화면 크기에 적응하는 방식)과 같은 측면을 처리하여 웹 페이지의 표시 및 시각적 모양을 제어합니다. 마치 건물의 인테리어나 장식과도 같습니다.
• JavaScript: 두뇌. JavaScript는 웹 페이지에 상호작용성과 동적 동작을 추가합니다. 양식 유효성 검사, 애니메이션, 대화형 지도 등을 가능하게 합니다. 마치 건물의 전기 배선 및 스마트 홈 기능과 같아서 건물을 기능적이고 역동적으로 만듭니다.

4. 웹 브라우저: 웹으로 향하는 창

웹 브라우저는 World Wide Web에 액세스하고 상호 작용할 수 있는 필수 소프트웨어 애플리케이션입니다. 2024년 인기 브라우저는 다음과 같습니다.

• 구글 크롬
• 모질라 파이어폭스
• 마이크로소프트 엣지
• 사파리
• 용감한
• 오페라

브라우저 작동 방식: URL을 입력하면 브라우저는 해당 리소스를 호스팅하는 웹 서버에 요청을 보냅니다. 서버는 필요한 파일(HTML, CSS, JavaScript, 이미지 등)을 다시 보내고 브라우저는 이러한 파일을 해석하여 장치에 웹 페이지를 렌더링(표시)합니다.

5. 서버: 웹의 최강자

서버는 웹 리소스를 저장, 처리하고 클라이언트(예: 웹 브라우저)에 전달하는 특수 컴퓨터입니다. 다양한 유형의 서버가 있으며 각 서버에는 특정 역할이 있습니다.

• 웹 서버: 웹 페이지 및 기타 웹 콘텐츠를 제공하도록 설계되었습니다. 널리 사용되는 웹 서버 소프트웨어에는 Apache, Nginx 및 Microsoft IIS가 있습니다. HTTP/HTTPS를 통해 요청을 처리하고 데이터베이스와 상호 작용하며 요청된 리소스를 전달합니다.
• 메일 서버: 이메일 전송, 수신 및 라우팅을 처리합니다. 이들은 SMTP(Simple Mail Transfer Protocol), POP3(Post Office Protocol 버전 ​​3) 및 IMAP(인터넷 메시지 액세스 프로토콜)과 같은 프로토콜을 사용합니다.
• 파일 서버: 사용자가 네트워크를 통해 파일을 저장, 액세스 및 관리할 수 있도록 허용합니다. FTP(파일 전송 프로토콜) 또는 SFTP(보안 파일 전송 프로토콜)를 자주 사용합니다.

6. 데이터베이스: 웹 정보 정리

데이터베이스는 정보를 쉽게 저장, 검색, 관리 및 업데이트할 수 있도록 구성된 데이터 모음입니다. 이는 대부분의 동적 웹사이트와 웹 애플리케이션에 매우 중요합니다.

• 관계형 데이터베이스(SQL): 행과 열이 있는 테이블에 데이터를 저장하여 테이블 간의 관계를 설정합니다. 이는 구조화된 데이터에 이상적이며 데이터 조작에 SQL(구조적 쿼리 언어)을 사용합니다. 예: MySQL, PostgreSQL, Oracle, SQL Server
• 비관계형 데이터베이스(NoSQL): 문서, 키-값 쌍 또는 그래프와 같은 보다 유연한 형식으로 데이터를 저장합니다. 이는 대량의 비정형 또는 반정형 데이터에 적합합니다. 예: MongoDB, Cassandra, Redis, Couchbase.

7. 클라이언트-서버 아키텍처: 웹 상호작용의 기초

웹은 기본적으로 클라이언트-서버 아키텍처에서 작동합니다.

• 클라이언트: 웹 브라우저에서 리소스를 요청합니다.
• 서버: 리소스를 저장하고 전달하는 컴퓨터입니다.

브라우저는 다음을 사용하여 수신된 데이터를 해석합니다.

• DOM(Document Object Model) 인터프리터: HTML 구조를 구문 분석합니다.
• CSS 인터프리터: CSS에 정의된 스타일을 적용합니다.
• JavaScript 엔진: JavaScript 코드를 실행하여 상호작용성을 추가합니다.

8. 웹 개발 유형: 프런트엔드, 백엔드, 풀스택

웹 개발은 일반적으로 세 가지 주요 영역으로 나뉩니다.

• 프런트 엔드 개발: 사용자 인터페이스(UI)와 사용자 경험(UX), 즉 사용자가 브라우저에서 직접 보고 상호 작용하는 모든 것에 중점을 둡니다. 프런트엔드 개발자는 HTML, CSS, JavaScript를 사용하며 종종 React, Angular 또는 Vue.js와 같은 프레임워크와 함께 사용합니다.
• 백엔드 개발: 프런트엔드를 지원하는 서버측 로직, 데이터베이스 및 API를 다룹니다. 백엔드 개발자는 Python, Java, Node.js, PHP, Ruby 등의 서버측 언어와 데이터베이스 기술을 사용하여 작업합니다.
• 풀스택 개발: 프론트엔드와 백엔드 개발을 모두 포함합니다. 풀스택 개발자는 다양한 기술에 능숙하여 웹 애플리케이션의 모든 측면을 작업할 수 있습니다. 인기 있는 전체 스택 조합으로는 MERN(MongoDB, Express.js, React, Node.js), MEAN(MongoDB, Express.js, Angular, Node.js) 등이 있습니다.

9. 웹 호스팅: 귀하의 웹사이트를 접근성 있게 만들기

웹 호스팅은 인터넷 사용자가 웹사이트나 웹 애플리케이션에 액세스할 수 있도록 해주는 서비스입니다. 웹 호스팅 제공업체는 웹 사이트 파일을 저장하고 연중무휴 24시간 사용할 수 있도록 서버(데이터 센터)에 공간을 제공합니다. 인기 있는 호스팅 옵션으로는 공유 호스팅, VPS 호스팅, 전용 서버 및 클라우드 호스팅이 있습니다.

시간 내주셔서 감사합니다.

위 내용은 웹 5의 빌딩 블록의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!