티스토리 뷰

카테고리 없음

웹 개발 관련 필수로 알아야 할 용어: 웹 개발에 첫 발을 들였다면 꼭 봐야합니다

프롬프트엔지니어 홍 2023. 5. 5. 18:00

웹 개발 초보자를 위한 용어 가이드입니다. 웹 개발 관련 필수 용어를 쉽게 이해하고 익힐 수 있는 정보를 공유합니다.

핵심

웹 개발을 시작하려는 분들에게 필요한 필수 용어를 설명하고, 이를 통해 웹 개발 과정에서 겪게 될 다양한 개념을 이해하는 데 도움을 주기 위해 정리해보았습니다.

웹 개발 관련 필수로 알아야 할 용어를 통해 기초적인 개념부터 고급 개념까지 알아봅시다.

* 구성

  • HTML, CSS, JavaScript 소개
  • 웹 서버와 클라이언트
  • 프론트엔드와 백엔드
  • 웹 표준과 웹 접근성
  • HTTP와 HTTPS
  • RESTful API
  • 웹 호스팅
  • 웹 프레임워크
  • 웹 브라우저 호환성
  • 웹 개발자 도구
  • 웹 개발 관련 알아두면 좋을 용어 리스트업

* 상위문서

  • 웹 개발 기초
  • 웹 디자인 기초
  • 웹 프로그래밍 언어

1. HTML, CSS, JavaScript 소개

  • HTML(하이퍼텍스트 마크업 언어)은 웹 페이지의 구조를 만드는 데 사용되는 언어입니다.
  • CSS(캐스케이딩 스타일 시트)는 웹 페이지의 디자인과 레이아웃을 꾸미는 데 사용됩니다.
  • JavaScript는 웹 페이지에 상호작용성을 추가하는 데 사용됩니다.

2. 웹 서버와 클라이언트

  • 웹 서버는 웹 페이지를 저장하고 클라이언트에게 전달하는 컴퓨터 시스템입니다.
  • 클라이언트는 일반적으로 웹 브라우저를 사용해 웹 페이지를 요청하고 서버로부터 받아옵니다.
3. 프론트엔드와 백엔드
  • 프론트엔드는 사용자와 직접 상호작용하는 웹 페이지의 사용자 인터페이스(UI)를 개발하는 분야입니다.
  • 백엔드는 서버, 데이터베이스, 애플리케이션 로직을 개발하여 웹 사이트의 핵심 기능을 구현하는 분야입니다.
4. 웹 표준과 웹 접근성
  • 웹 표준은 웹 기술의 일관성과 상호 운용성을 유지하기 위한 규칙입니다. W3C(World Wide Web Consortium)와 같은 국제 기구에서 정의됩니다.
  • 웹 접근성은 모든 사용자가 웹 사이트의 정보와 기능에 동등하게 접근할 수 있도록 보장하는 원칙입니다. 이를 위해 화면 리더와 같은 보조 기술을 사용할 수 있는 웹 페이지를 디자인하는 것이 중요합니다.

5. HTTP와 HTTPS

  • HTTP(HyperText Transfer Protocol)는 웹 서버와 클라이언트 간에 정보를 주고받기 위한 프로토콜입니다.
  • HTTPS(HyperText Transfer Protocol Secure)는 HTTP에 보안 레이어를 추가하여 데이터를 암호화하는 방식으로, 웹 사이트의 보안을 강화합니다.

6. RESTful API

  • REST(Representational State Transfer)는 웹 서비스의 아키텍처 스타일로, 서버와 클라이언트 간의 통신을 간소화하고 표준화하기 위한 규칙입니다.
  • RESTful API는 웹 서비스를 구현하기 위해 REST 원칙을 따르는 API(Application Programming Interface)를 의미합니다

7. 웹 호스팅

웹 호스팅은 웹 사이트의 파일과 데이터를 저장하고, 인터넷을 통해 접근 가능하게 하는 서비스입니다. 웹 호스팅은 공유 호스팅, VPS(Virtual Private Server) 호스팅, 전용 서버 호스팅 등 다양한 종류가 있습니다.

8. 웹 프레임워크

웹 프레임워크는 웹 개발에 필요한 기능과 구조를 미리 만들어 놓은 라이브러리의 집합입니다. 프레임워크를 사용하면 개발 시간을 줄이고, 보다 효율적이고 안정적인 웹 애플리케이션을 구축할 수 있습니다.

9. 웹 브라우저 호환성

웹 브라우저 호환성은 웹 사이트가 다양한 브라우저에서 동일하게 작동하고 보여지도록 하는 것입니다. 이를 위해 웹 표준을 따르고, 브라우저의 특성과 버전을 고려하여 웹 페이지를 개발하는 것이 중요합니다.

10. 웹 개발자 도구

웹 개발자 도구는 웹 브라우저에 내장된 도구로, 웹 페이지의 HTML, CSS, JavaScript 코드를 확인하고 수정할 수 있습니다. 이를 통해 웹 개발자는 웹 페이지의 문제를 디버깅하고 최적화할 수 있습니다. 크롬, 파이어폭스, 사파리 등 주요 웹 브라우저에는 각자의 웹 개발자 도구가 포함되어 있습니다.

11. 웹 개발 관련 알아두면 좋을 용어 리스트업

다음은 웹 개발과 관련해서 알아두면 좋을 용어들을 리스트업한 자료입니다.

  • HTML(HyperText Markup Language) - 웹 페이지의 구조와 콘텐츠를 정의하는 마크업 언어입니다.
  • CSS(Cascading Style Sheets) - 웹 페이지의 디자인과 스타일을 정의하는 스타일 시트 언어입니다.
  • JavaScript - 웹 페이지의 동적인 기능을 구현하는 프로그래밍 언어입니다.
  • HTTP(Hypertext Transfer Protocol) - 인터넷 상에서 데이터를 주고받기 위한 프로토콜입니다.
  • URL(Universal Resource Locator) - 인터넷 상의 자원의 위치를 나타내는 주소입니다.
  • API(Application Programming Interface) - 소프트웨어 애플리케이션들이 서로 상호작용하기 위한 인터페이스입니다.
  • CMS(Content Management System) - 웹사이트 콘텐츠를 관리하고 발행하는 소프트웨어입니다.
  • SEO(Search Engine Optimization) - 검색 엔진 최적화로, 검색 엔진에서 노출되기 좋은 웹사이트를 만드는 기술입니다.
  • Responsive Design - 웹 사이트가 모바일, 태블릿, 데스크탑 등 다양한 디바이스에서 화면 크기에 따라 최적화되는 디자인입니다.
  • Cross-browser Compatibility - 다양한 웹 브라우저에서 동일하게 웹사이트가 보이도록 하는 기술입니다.
  • Server - 웹사이트나 어플리케이션의 데이터와 기능을 제공하는 컴퓨터 시스템입니다.
  • Client - 서버에서 데이터를 받아 화면에 표시하는 브라우저, 모바일 앱, 데스크톱 앱 등 사용자가 사용하는 시스템입니다.
  • Database - 데이터를 저장하는 컴퓨터 시스템입니다.
  • SQL(Structured Query Language) - 데이터베이스에서 데이터를 검색하고 조작하는 언어입니다.
  • CRUD(Create, Read, Update, Delete) - 데이터베이스에서의 기본적인 작업입니다.
  • REST(Representational State Transfer) - HTTP 프로토콜을 기반으로 하는 웹 서비스 아키텍처입니다.
  • JSON(JavaScript Object Notation) - 경량 데이터 교환 형식입니다.
  • AJAX(Asynchronous JavaScript and XML) - 비동기적으로 웹페이지를 업데이트하는 기술입니다.
  • Framework - 웹 애플리케이션 개발을 위한 구조와 틀을 제공하는 소프트웨어입니다.
  • Library - 개발자가 특정 기능을 구현하는 데 사용할 수 있는 코드와 도구의 모음입니다.
  • Git - 버전 관리 시스템으로, 개발자들이 프로젝트의 변경 이력을 관리하고 공유할 수 있도록 합니다.
  • GitHub - Git을 기반으로 하는 웹 호스팅 서비스로, Git 저장소를 공유하고 협업할 수 있습니다.
  • Agile - 소프트웨어 개발 방법론 중 하나로, 변화에 대응하고 고객 만족을 중요시합니다.
  • Test-Driven Development(TDD) - 테스트 코드를 먼저 작성하고 그에 따라 실제 코드를 작성하는 개발 방법론입니다.
  • Continuous Integration(CI) - 코드 변경사항이 발생할 때마다 자동으로 빌드 및 테스트를 실행하여 문제를 조기에 발견하는 방법론입니다.
  • Continuous Delivery(CD) - CI의 확장으로, 빌드와 테스트가 통과된 코드를 자동으로 배포하는 방법론입니다.
  • Serverless - 서버를 직접 관리하지 않고 클라우드 서비스 제공 업체가 서버를 자동으로 관리하도록 하는 방식입니다.
  • Docker - 컨테이너 기반 가상화 기술로, 애플리케이션을 격리된 환경에서 실행할 수 있습니다.
  • Kubernetes - 컨테이너 오케스트레이션 도구로, 여러 대의 서버에 걸쳐 컨테이너를 관리하고 배포합니다.
  • Scalability - 시스템의 성능을 확장할 수 있는 능력입니다.
  • Load Balancing - 여러 대의 서버에 요청을 분산하여 시스템의 부하를 분산하는 기술입니다.
  • CDN(Content Delivery Network) - 전 세계에 분산된 서버를 통해 콘텐츠를 제공하는 기술로, 더 빠른 콘텐츠 제공이 가능합니다.
  • SSL/TLS - 인터넷 상에서 데이터를 암호화하여 안전하게 전송하는 프로토콜입니다.
  • OAuth - 다른 애플리케이션에서 사용자 정보를 안전하게 공유할 수 있는 인증 프로토콜입니다.
  • Single Sign-On(SSO) - 여러 개의 애플리케이션에 대해 하나의 로그인 정보로 로그인할 수 있는 인증 방식입니다.
  • JWT(Json Web Token) - 인증 정보를 JSON 형식으로 저장하는 방식입니다.
  • Babel - ES6(ES2015) 이상의 JavaScript 코드를 이전 버전의 JavaScript 코드로 변환해주는 도구입니다.
  • Webpack - 모듈 번들러로, 프론트엔드 자바스크립트 애플리케이션을 관리하고 빌드할 수 있도록 도와줍니다.
  • Gulp - 빌드 자동화 도구로, 반복적인 작업을 자동화하여 개발자의 생산성을 높입니다.
  • Grunt - Gulp와 유사한 빌드 자동화 도구입니다.
  • Yarn - NPM과 유사한 패키지 관리자입니다.
  • Node.js - 서버 측 자바스크립트 런타임 환경으로, 자바스크립트를 사용하여 서버 애플리케이션을 구현할 수 있습니다.
  • Express - Node.js를 기반으로 한 웹 프레임워크로, 빠르고 간편한 서버 구현이 가능합니다.
  • Socket.IO - 웹 소켓 기반 실시간 통신 라이브러리로, 채팅 및 게임 등 실시간 애플리케이션을 구현할 수 있습니다.
  • GraphQL - API를 위한 쿼리 언어로, 클라이언트가 필요한 데이터만 요청하고 받을 수 있도록 합니다.
  • Redux - 상태 관리 라이브러리로, 복잡한 애플리케이션의 상태를 효율적으로 관리할 수 있습니다.
  • Angular - 구글에서 만든 프론트엔드 프레임워크로, 대규모 애플리케이션을 구축할 수 있습니다.
  • React Native - React를 기반으로 한 모바일 앱 개발 프레임워크로, iOS와 Android 양쪽 플랫폼에서 앱을 개발할 수 있습니다.
  • Ionic - Angular 기반 하이브리드 모바일 앱 개발 프레임워크입니다.
  • PWA(Progressive Web App) - 웹과 앱의 기능을 결합한 웹 앱입니다.
  • Accessibility - 웹 사이트나 애플리케이션의 모든 사용자가 쉽게 이용할 수 있도록 설계하는 것입니다.
  • Usability - 사용자 경험을 고려한 웹 사이트나 애플리케이션의 설계와 개발입니다.
  • Wireframe - 웹 사이트나 애플리케이션의 구조와 레이아웃을 설계하는 작업입니다.
  • Mockup - 웹 사이트나 애플리케이션의 디자인을 시각적으로 표현하는 작업입니다.
  • Prototype - 웹 사이트나 애플리케이션의 기능을 검증하기 위해 만들어지는 시제품입니다.
  • Responsive Images - 다양한 해상도의 화면에 맞게 이미지를 최적화하는 기술입니다.
  • Lazy Loading - 페이지의 로딩 속도를 높이기 위해 필요한 요소만 불러오는 기술입니다.
  • Minification - 파일의 크기를 최소화하여 페이지 로딩 속도를 높이는 기술입니다.
  • CDN(Content Delivery Network) - 전 세계에 분산된 서버를 통해 콘텐츠를 제공하는 기술로, 더 빠른 콘텐츠 제공이 가능합니다.
  • Microservices - 독립적인 기능을 갖는 작은 서비스를 구축하여 확장성과 유연성을 높이는 아키텍처입니다.
  • Monolithic Architecture - 전통적인 서버 구조로, 하나의 애플리케이션 안에 모든 기능이 포함됩니다.
  • RESTful API - REST 아키텍처 스타일을 따르는 API로, 자원을 URL로 표현하고 HTTP 메서드
  • (GET, POST, PUT, DELETE 등)를 사용해 자원을 조작합니다.
  • Headless CMS - CMS의 콘텐츠 관리 기능만 사용하고, 프론트엔드는 개발자가 직접 구현하는 아키텍처입니다.
  • Lighthouse - 웹사이트 성능을 측정하고 최적화하는 도구입니다.
  • WebVTT(Web Video Text Tracks) - 동영상에 대한 자막을 표시하기 위한 포맷입니다.
  • AMP(Accelerated Mobile Pages) - 모바일 페이지의 속도를 높이기 위한 프로젝트입니다.
  • CMS(Content Security Policy) - 웹사이트에서 사용하는 리소스들의 출처를 제한하는 보안 기술입니다.
  • Cookie - 웹 사이트의 상태 정보를 유지하기 위해 사용되는 작은 데이터 파일입니다.
  • Session - 웹 사이트에서 사용자의 상태 정보를 유지하기 위해 사용되는 임시 저장소입니다.
  • OAuth - 서비스 제공자에서 사용자의 인증 정보를 확인하고, 인증된 사용자만 서비스를 이용할 수 있도록 하는 프로토콜입니다.
  • CORS(Cross-Origin Resource Sharing) - 웹 사이트에서 다른 출처의 리소스에 접근하기 위한 보안 프로토콜입니다.
  • SQL Injection - 웹 사이트의 취약점을 이용해 SQL 쿼리를 주입하여 데이터를 조작하는 공격입니다.
  • Firewall - 네트워크에서 비인가된 접근을 차단하는 보안장치입니다.
  • SSL/TLS - 웹 사이트의 데이터를 암호화하여 안전하게 전송하는 프로토콜입니다.
  • VPN(Virtual Private Network) - 인터넷을 통해 비공개 네트워크를 구축하여 보안성을 강화하는 기술입니다.
  • WAF(Web Application Firewall) - 웹 사이트에서 발생할 수 있는 공격을 탐지하고 차단하는 보안장치입니다.
  • DMZ(De-Militarized Zone) - 공격자의 침입을 방지하기 위해 외부와 내부 사이에 별도의 네트워크를 구성하는 기술입니다.
  • Encryption - 데이터를 암호화하여 누구나 알아볼 수 없도록 하는 기술입니다.
  • Decryption - 암호화된 데이터를 원래의 데이터로 복원하는 기술입니다.
  • Hashing - 데이터를 고정된 길이의 값으로 변환하는 기술입니다.
  • Salt - 해시 함수에 사용되는 무작위 데이터로, 보안성을 높이는 역할을 합니다.
  • Rainbow Table - 해시 함수의 약점을 이용하여 원래 데이터를 추측하는 기술입니다.
  • Two-Factor Authentication(2FA) - 사용자의 인증 정보를 두 가지 요소(비밀번호와 인증번호 등)로 나누어 더욱 강력한 보안을 제공하는 방식입니다.
  • Biometric Authentication - 생체 인증 기술을 사용하여 사용자의 신원을 확인하는 방식입니다.
  • Biometric Authentication - 생체 인증 기술을 사용하여 사용자의 신원을 확인하는 방식입니다.
  • CAPTCHA(Completely Automated Public Turing test to tell Computers and Humans Apart) - 컴퓨터와 사람을 구별하기 위해 사용되는 보안 기술입니다.
  • Honeypot - 공격자를 유혹하여 공격을 탐지하고 차단하는 보안 기술입니다.
  • Vulnerability - 시스템의 취약점으로, 공격자에 의해 악용될 수 있는 상황을 말합니다.
  • Penetration Testing - 시스템의 취약점을 확인하고 보안성을 평가하는 검증 작업입니다.
  • Bug Bounty - 보안 취약점을 발견한 사람에게 보상을 주는 제도입니다.
  • White Box Testing - 소스 코드에 대한 정보를 제공받고, 시스템의 내부 구조를 파악하여 테스트하는 방식입니다.
  • Black Box Testing - 소스 코드에 대한 정보를 제공받지 않고, 시스템을 외부에서 테스트하는 방식입니다.

 

웹 개발 관련 필수로 알아야 할 용어를 통해 웹 개발의 기초를 이해하고 웹 개발 공부를 시작할 수 있습니다. 더 나은 이해를 위해 이 글만 보는 것이 아니라, 다른 추천 세부 주제들도 살펴보는 것을 권장드립니다..

* 함께 읽으면 좋을 연관 주제

  • 웹 디자인 기초
  • 프론트엔드 개발자가 알아야 할 주요 라이브러리와 프레임워크
  • 백엔드 개발자를 위한 서버 사이드 언어 비교
  • 웹 개발을 위한 협업 도구 소개

 

저작자표시 비영리 변경금지 (새창열림)