기술나눔

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

웹 프론트엔드 개발은 프론트엔드 기술의 중요한 구성요소로서 모바일 인터넷, 빅데이터 및 IT 산업의 발전과 함께 항상 중요한 위치를 차지하고 있습니다. 인공지능, 현재의 프런트 엔드 지식 시스템도 점차 풍부해지고 있습니다.

웹 프론트엔드 작업에 익숙한 친구들은 웹에 많은 기술이 있다는 것을 알고 있습니다. 자격을 갖춘 웹 프론트엔드 엔지니어가 되려면 Html, CSS, Ajax 등의 기술을 하나씩 마스터해야 합니다. jquery, extjs 및 JavaScript.

핵심기술

1.HTML

HTML을 마스터하는 것은 월드와이드웹 페이지를 만드는 표준 언어이자 월드와이드웹 브라우저에서 사용되는 언어인 웹페이지의 핵심이며, 서로 다른 컴퓨터 간의 정보 교환에 대한 장벽을 제거합니다. 따라서 현재 인터넷에서 가장 널리 사용되는 언어이자 웹 문서를 구성하는 주요 언어이기도 합니다. HTML을 잘 배우는 것은 웹 프론트엔드 개발자가 되기 위한 기본 조건입니다.

HTML은 웹 페이지를 구현하고 브라우저에 표시하는 마크업 언어입니다. HTML의 최신 버전인 HTML5는 여러 가지 새로운 기술을 도입하여 애플리케이션에 대한 지원을 크게 향상시켜 웹 기술이 더 이상 웹 콘텐츠 렌더링에만 국한되지 않게 해줍니다.

CSS, JavaScript, Flash 및 기타 기술의 발전으로 웹의 애플리케이션 처리 능력이 점차 향상되었으며 사용자의 웹 검색 경험이 크게 향상되었습니다. 그러나 HTML5의 여러 가지 새로운 기술이 질적으로 획기적인 발전을 이루면서 웹 기술이 처음으로 로컬 기본 응용 프로그램 기술에 가까운 것으로 간주되었으며 웹 응용 프로그램 개발은 진정으로 개발자의 선택이 되었습니다.

HTML5는 이론적으로 브라우저의 도움으로 다양한 플랫폼에서 단일 개발을 실행할 수 있어 개발 비용을 절감할 수 있으며 이는 일반적으로 업계에서 HTML5 기술의 주요 장점 중 하나로 간주됩니다. . AppMobi, Motorola, Sencha, Appcelerator 및 기타 회사에서는 HTML5 애플리케이션 개발을 지원하기 위해 비교적 성숙한 개발 도구를 출시했습니다.

2、CSS

CSS를 잘 배우는 것은 웹페이지의 외관을 더욱 아름답게 만드는 데 중요한 포인트입니다.

3、자바스크립트

JavaScript의 기본 구문과 JavaScript로 프로그래밍하는 방법을 배우면 개발자로서의 개인 기술이 향상됩니다.

JavaScript는 웹 중심 애플리케이션을 생성하도록 설계된 경량 해석 프로그래밍 언어입니다. JavaScript는 HTML과 통합되어 있으며 개방형 크로스 플랫폼이므로 구현하기가 매우 쉽습니다.

자바스크립트의 역할:

• 1) 사용자 클릭에 응답하고 사용자에게 더 나은 경험을 제공하는 등 웹 페이지를 대화형으로 만듭니다.

• 2) 양식을 처리하고, 사용자 입력을 확인하고, 적시에 피드백을 제공하여 사용자 시간을 절약할 수 있습니다. 예를 들어, 양식에 이메일 주소를 입력하라는 메시지가 표시되지만 휴대폰 번호를 입력하면 알림이 제공되어야 합니다.

• 3) 페이지는 사용자 작업에 따라 동적으로 생성될 수도 있습니다. 예를 들어 이메일을 보낼 때 첨부 파일을 추가하세요.

• 4) 쿠키 설정 쿠키는 귀하가 방문한 웹사이트 주소, 귀하가 사용한 사용자 이름 등 브라우저에 저장되는 임시 정보입니다.

• 5) JavaScript는 정기적으로 반복되는 HTML 단락을 단순화하고 다운로드 시간을 줄입니다.

• 6), 브라우저 및섬기는 사람가장 널리 사용되는 Ajax 비동기 전송과 같은 데이터 통신을 수행합니다.

• 7) 더욱 풍부한 인터페이스 - JavaScript를 사용하여 드래그 앤 드롭 구성 요소 및 슬라이더와 같은 항목을 포함하여 사이트 방문자에게 풍부한 인터페이스를 제공할 수 있습니다.

4. jQuery

jQuery는 프로토타입 이후의 또 다른 뛰어난 Javascript 프레임워크입니다. jQuery는 사용자가 HTML 문서와 이벤트를 보다 쉽게 ​​처리하고, 애니메이션 효과를 얻고, 웹 사이트에 AJAX 상호 작용을 쉽게 제공할 수 있게 해주는 빠르고 간결한 Javascript 라이브러리입니다.

5. PHP

중첩된 약어 이름인 PHP는 English Hypertext Preprocessing Language(PHP: Hypertext Preprocessor)의 약어입니다. PHP는 HTML 임베디드 언어입니다.

6、AJAX

AJAX는 "Asynchronous Java and XML"의 약자로 대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술을 나타냅니다. 중국에서 흔히 사용되는 발음은 'Ajax'로, 이는 Ajax 축구팀의 발음과 동일합니다.

Ajax는 빠르고 동적인 웹 페이지를 만드는 데 사용되는 기술입니다. Ajax는 백그라운드에서 서버와 소량의 데이터를 교환함으로써 전체 웹 페이지를 다시 로드하지 않고도 웹 페이지의 일부를 업데이트할 수 있습니다.

7、API

API(애플리케이션 프로그래밍 인터페이스)는 애플리케이션과 개발자가 소스 코드에 액세스하거나 작업 메커니즘의 세부 사항을 이해하지 않고도 특정 소프트웨어 또는 하드웨어를 기반으로 하는 일련의 루틴에 액세스할 수 있는 기능을 제공하는 사전 정의된 기능 세트입니다.

8、ASP

ASP는 Active Server Page의 약자로 "동적 서버 페이지"를 의미합니다. ASP는 CGI 스크립트 프로그램을 대체하기 위해 Microsoft에서 개발한 응용 프로그램으로 데이터베이스 및 기타 프로그램과 상호 작용할 수 있으며 간단하고 편리한 프로그래밍 도구입니다. ASP 웹 페이지 파일의 형식은 다음과 같습니다. ASP는 이제 다양한 동적 웹사이트에서 일반적으로 사용됩니다.

9、Google 웹 툴킷

Google Web Toolkit(줄여서 GWT)은 Google에서 출시한 Ajax 애플리케이션 개발 키트입니다. GWT는 개발자가 Java 언어를 사용하여 Ajax 애플리케이션을 개발할 수 있도록 지원합니다.

10. 운영 체제

Unix와 Linux의 기본을 이해하는 것은 개발자에게 도움이 됩니다.

11. 네트워크 서버

Apache의 기본 구성, htaccess 구성 기술 마스터 등을 포함하여 웹 서버를 이해합니다.

프론트엔드 프레임워크

HTML, 서버측 스크립팅 언어, CSS 및 JavaScript에 익숙해진 후 웹 프레임워크를 배우면 웹 개발 속도를 높이고 시간을 절약할 수 있습니다. PHP 프로그래머를 위한 선택적 프레임워크로는 CakePHP, CodeIgniter, Zend 등이 있습니다. Python 프로그래머는 Django와 webpy를 선호하고, Ruby 프로그래머는 RoR을 자주 사용합니다.

웹이 더욱 표준화되고 표준화됨에 따라 웹 구성 요소화 기술은 계속해서 혁신을 거듭하고 있으며 모바일 터미널 개발은 계속해서 승화되고 있습니다. 다음은 몇 가지 일반적인 오픈 소스 프런트 엔드 프레임워크입니다.

• 부트스트랩

주류 프레임워크 중 하나인 Bootstrap은 HTML, CSS 및 JavaScript를 기반으로 하며 간단하고 유연하여 웹 개발을 더 빠르게 만듭니다.

html5-보일러플레이트

이 프레임워크는 강력하고 적응 가능한 웹 앱이나 웹 사이트를 빠르게 구축할 수 있습니다.

• 유성

Meteor는 실시간 웹 애플리케이션 개발을 위한 차세대 오픈 소스 프레임워크로, 더 짧은 시간에 개발을 완료할 수 있습니다.

• 의미론적 UI

자연어의 효과적인 원리를 기반으로 한 UI 컴포넌트 프레임워크

• 기반

뛰어난 반응형 프런트엔드 프레임워크

• 구체화하다

머티리얼 디자인을 기반으로 한 현대적인 반응형 프런트엔드 프레임워크입니다. 기본 스타일과 사용자 정의 구성요소를 제공할 수 있습니다. 또한 Materialise는 애니메이션과 전환을 개선하여 개발자에게 원활한 경험을 제공합니다.

• 순수한

거의 모든 웹 프로젝트에서 사용할 수 있는 작고 반응성이 뛰어난 CSS 모듈 세트입니다.

• 뷰

Vue.js는 대화형 웹 인터페이스를 구축하기 위한 라이브러리입니다. 간단하고 유연한 API를 통해 MVVM 데이터 바인딩 및 구성 가능한 구성 요소 시스템을 제공합니다.

• 모난

AngularJS는 Misko Hevery 등이 2009년에 만들었으며 나중에 Google에 인수되었습니다. 많은 제품에서 사용되는 뛰어난 프론트엔드 JS 프레임워크입니다. 고급 개념을 갖춘 프런트엔드 개발 프레임워크일 뿐만 아니라 엔드투엔드 솔루션이기도 합니다. 이는 아키텍처 설계의 MVC 패턴을 따르며 데이터와 논리적 처리 구성 요소의 느슨한 결합을 옹호합니다. AngularJS는 명령 기술을 통해 HTML의 자연스러운 확장을 실현하고, 컴파일 기술을 통해 데이터 모델과 디스플레이 뷰의 양방향 자동 동기화를 실현하여 복잡한 DOM 작업을 완화합니다. 또한 프런트엔드 자동화 테스트 기술에 대한 우수한 지원도 제공합니다.

Angular는 단일 애플리케이션 인터페이스를 생성하기 위한 프런트 엔드 프레임워크로 데이터 바인딩, 서비스, 지시문, 종속성 주입 등과 같은 많은 핵심 기능을 갖추고 있습니다.강력한 모듈 기능을 가지고 있으며 사용자 정의 명령의 장점이 있습니다.

• 반응하다

페이스북이 제작한 React는 Angular보다 4년 뒤인 2013년에 공식 출시됐지만, 혁신적인 VirtualDOM 덕분에 성능 면에서AngularJS를 능가하면서 큰 인기를 끌었습니다. VirtualDOM, JSX, Diff 알고리즘 등을 포함한 많은 기능이 있으며 ES6 구문을 지원하고 함수형 프로그래밍을 사용합니다. 임계값은 약간 높지만 더 유연하여 더 많은 개발 가능성을 허용합니다.

React는 주로 UI를 구축하는 데 사용됩니다. UI 렌더링에 도움이 되는 선언 코드, 정적 HTML DOM 요소, 동적 변수, 대화형 애플리케이션 구성 요소 등 다양한 유형의 매개 변수를 React에서 전달할 수 있습니다.

• 해골

Skeleton은 휴대폰을 포함한 다양한 화면 장치에 적합한 아름다운 웹사이트를 빠르게 개발할 수 있는 작은 JS 및 CSS 파일 모음입니다. Skeleton은 960 그리드를 기반으로 개발되었습니다. UI 프레임워크입니다.

• 놀라운 UI

향상된 중국어 조판 지원과 풍부한 현지화된 구성 요소를 갖춘 중국 최초의 오픈 소스 HTML5 크로스 스크린 프런트 엔드 프레임워크 제품 시리즈입니다. 이 제품 시리즈에는 모바일 단말기용 HTML5 하이브리드 애플리케이션 개발 프레임워크인 Amaze UI Touch와 크로스 스크린 HTML5 웹 페이지 개발을 위해 설계된 Amaze UI Web이 포함됩니다. 그중에서도 Amaze UI Touch는 개발자가 풍부한 구성 요소를 통해 기본 앱과 비교할 수 있는 독점적인 모바일 HTML5 애플리케이션을 신속하게 구축하는 데 도움이 될 수 있습니다.

• UI킷

신속한 개발과 강력한 웹 인터페이스를 위한 경량의 모듈식 프런트 엔드 프레임워크입니다.

• 유이

Yahoo! UI 라이브러리(YUI)는 대화형 웹 페이지를 만들기 위해 AJAX, DHTML 및 DOM과 같은 코딩 기술을 사용하는 오픈 소스 JavaScript 함수 라이브러리입니다. 또한 많은 CSS 리소스가 포함되어 있습니다. 사용 라이센스는 BSD 라이센스입니다.

• 키시

교차 터미널, 모듈식, 고성능 및 사용하기 쉬운 JavaScript 프레임워크입니다.

• 무이

네이티브 앱 경험의 프런트엔드 프레임워크에 가장 가까운 프레임워크입니다.

• 아랄레

개방적이고 간단하며 사용하기 쉬운 프런트 엔드 기본 클래스 라이브러리입니다.

• 제이엑스

JX는 대규모 산업급 웹 앱을 구축하고 구성하는 데 특히 적합한 모듈식 비침해적 웹 프런트 엔드 프레임워크입니다.

• 미국

GMU는 zepto 기반의 모바일 UI 컴포넌트 라이브러리로, 웹앱과 패드용 간단하고 사용하기 쉬운 UI 컴포넌트를 제공합니다!

• 주이

오픈 소스 HTML5 프런트엔드 프레임워크

• 클라우다 터치.js

Touch.js는 모바일 장치용 제스처 인식 및 이벤트 라이브러리이며 Baidu 내에서 널리 사용되는 개발이기도 합니다.