찾다
웹 프론트엔드프런트엔드 Q&A자바스크립트에는 어떤 라이브러리가 있나요?

Javascript 라이브러리에는 jQuery, React, "D3.js", Underscore, Lodash, Algolia Places, "Anime.js", Animate On Scroll, "Bideo.js", "Chart.js" 등이 포함됩니다.

자바스크립트에는 어떤 라이브러리가 있나요?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

JavaScript 라이브러리란 무엇인가요?

JavaScript 라이브러리에는 웹 페이지 또는 JS 기반 애플리케이션에서 실제 작업을 수행하는 다양한 함수, 메서드 또는 개체가 포함되어 있습니다. 이를 사용하여 WordPress 웹사이트를 구축할 수도 있습니다.

좋아하는 책을 다시 읽을 수 있는 도서관이라고 생각해보세요. 당신은 작가가 되어 다른 작가의 책을 즐기고, 새로운 관점이나 혁신을 얻고 이를 인생에서 사용할 수도 있습니다.

마찬가지로 JavaScript 라이브러리에는 개발자가 약간의 수정을 통해 재사용하고 사용할 수 있는 코드나 기능이 있습니다. 개발자는 JS 라이브러리 코드를 작성하고 다른 개발자는 슬라이드를 처음부터 작성하는 대신 동일한 코드를 재사용하여 슬라이드 준비와 같은 특정 작업을 수행합니다. 이렇게 하면 시간과 에너지가 많이 절약됩니다.

이는 JavaScript 라이브러리를 만드는 동기가 되므로 여러 사용 사례에서 수십 개를 찾을 수 있습니다. 시간을 절약할 뿐만 아니라 전체 개발 프로세스를 단순화합니다.

JavaScript 라이브러리 사용 방법

앱에서 JavaScript 라이브러리를 사용하려면 라이브러리 소스 경로 또는 URL을 참조하는 src 속성을 사용하여

요소에 추가하세요.

자세한 내용은 사용하려는 JavaScript 라이브러리의 설명서를 읽고 여기에 제공된 단계를 따르세요.

Javascript 라이브러리 공유

1. jQuery

jQuery는 빠르고 가벼우며 기능이 풍부한 클래식 JavaScript 라이브러리입니다. BarCamp NYC의 John Resig가 2006년에 건축했습니다. jQuery는 MIT에서 라이센스를 받은 무료 오픈 소스 소프트웨어입니다.

HTML 문서 조작 및 탐색, 애니메이션, 이벤트 처리 및 Ajax를 더 쉽게 만듭니다.

특징 및 장점:

  • 사용하기 쉬운 간단한 API가 있습니다.

  • 스타일 속성을 처리하고 요소를 찾을 때 CSS3 선택기를 사용합니다.

  • jQuery는 gzip 및 압축 크기가 30kb에 불과하고 경량이며 AMD 모듈을 지원합니다.

  • 구문이 CSS와 매우 유사하기 때문에 초보자도 쉽게 배울 수 있습니다.

  • 플러그인을 통해 확장 가능.

  • Chrome 및 Firefox를 포함한 여러 브라우저를 지원하는 API의 다양성.

사용 사례:

  • 특정 조건을 사용하여 DOM에서 노드를 선택하는 CSS 선택기를 사용한 DOM 조작. 이러한 조건에는 요소 이름과 해당 속성(예: 클래스 및 ID)이 포함됩니다.

  • Sizzle(오픈 소스, 다중 브라우저 선택기 엔진)을 사용하여 DOM에서 요소를 선택하세요.

  • 효과, 이벤트, 애니메이션을 만들어보세요.

  • JSON 구문 분석.

  • Ajax 애플리케이션 개발.

  • 기능 감지.

  • Promise 및 Deferred 객체를 사용하여 비동기 처리를 제어하세요.

2. React.js

React.js(ReactJS 또는 React라고도 함)는 오픈 소스 프런트 엔드 JavaScript 라이브러리입니다. 페이스북의 소프트웨어 엔지니어였던 조던 워크(Jordan Walke)가 2013년에 설립했습니다.

이제는 MIT 라이센스를 따르지만 원래는 Apache 라이센스 2.0으로 출시되었습니다. React는 대화형 UI를 쉽게 만들 수 있도록 설계되었습니다.

앱의 각 상태에 대한 간단한 보기를 디자인하세요. 다음으로, 데이터 변경 사항에 따라 올바른 구성 요소를 효율적으로 렌더링하고 업데이트합니다.

기능 및 이점:

  • React 코드에는 React DOM 라이브러리의 도움으로 DOM의 특정 요소로 렌더링되어야 하는 구성 요소 또는 엔터티가 포함되어 있습니다.

  • 데이터 구조에 메모리 내 캐시를 생성하고 차이를 계산한 후 브라우저에 표시된 DOM을 효율적으로 업데이트하여 가상 DOM을 사용합니다.

  • 이러한 선택적 렌더링으로 인해 개발자가 페이지 레이아웃, CSS 스타일 및 전체 페이지 렌더링을 다시 계산하는 수고를 덜면서 애플리케이션 성능이 향상됩니다.

  • 엔터티 수명주기의 특정 지점에서 코드 실행을 허용하기 위해 render 및 componentDidMount와 같은 수명주기 메서드를 사용합니다.

  • JS와 HTML을 결합한 JavaScript XML(JSX)을 지원합니다. 중첩된 요소, 속성, JS 표현식 및 조건문을 사용하여 구성 요소 렌더링을 용이하게 합니다.

사용 사례:

  • 모바일 또는 단일 페이지 애플리케이션을 개발할 때 기반으로 사용됩니다.

  • 상태를 DOM에 표시하고 관리합니다.

  • 웹 애플리케이션과 대화형 사이트를 개발할 때 효과적인 사용자 인터페이스를 구축하세요.

  • 디버깅과 테스트가 더 쉬워졌습니다.

우리 모두 알고 있듯이 Facebook, Instagram 및 Whatsapp은 모두 React를 사용합니다.

3、D3.js

데이터 기반 문서(줄여서 D3) 또는 D3.js는 개발자가 데이터 기반 문서 작업에 사용할 수 있는 또 다른 유명한 JS 라이브러리입니다. BSD 라이선스로 2011년에 출시되었습니다.

특징 및 이점:

  • 웹 표준을 강조하고 하나의 프레임워크 대신 최신 브라우저 기능을 제공합니다.

  • D3.js는 강력한 데이터 시각화를 지원합니다.

  • HTML, CSS, SVG를 지원합니다.

  • 은 데이터 기반 접근 방식을 취하고 이를 DOM 조작에 적용합니다.

  • D3.js는 빠르며 애니메이션과 상호 작용을 위한 여러 동적 동작과 데이터 세트를 지원합니다.

  • 오버헤드를 줄여 높은 프레임 속도에서 그래픽 복잡성을 높일 수 있습니다.

사용 사례:

  • 대화형 및 동적 데이터 시각화를 생성합니다.

  • 데이터를 DOM에 바인딩하고 DOM에서 데이터 기반 변환을 수행합니다. 예를 들어 숫자 배열에서 HTML 테이블을 생성한 다음 D3.js를 사용하여 SVG 막대 차트 또는 3D 표면도를 생성할 수 있습니다.

  • 기능 코드를 사용하면 많은 수의 모듈에서 재사용이 가능합니다.

  • D3는 선언적 접근 방식을 사용하여 스타일 또는 속성 변경, 노드 추가, 정렬 또는 제거, 텍스트 또는 HTML 콘텐츠 변경 등과 같은 노드 변경을 위한 여러 모드를 제공합니다.

  • 애니메이션 전환을 만들려면 이벤트를 통해 복잡한 전환 순서를 지정하고 CSS3 전환 등을 수행하세요.

4. Underscore.js

Underscore는 일반적인 프로그래밍 작업에 다양한 기능을 제공하는 JavaScript 유틸리티 라이브러리입니다. 2009년 Jeremy Askenas에 의해 만들어졌으며 MIT 라이선스에 따라 라이선스가 부여됩니다. 이제 Lodash는 그것을 능가했습니다.

기능 및 이점:

  • Prototype.js(또 다른 인기 있는 유틸리티 라이브러리)와 유사하게 작동하지만 Underscore는 객체 프로토타입 확장 대신 기능적 프로그래밍 디자인을 가지고 있습니다.

  • 작업하는 데이터 유형에 따라 4가지 유형의 100개 이상의 기능이 있습니다. 조작할 수 있는 기능은 다음과 같습니다.

    • Objects

    • Arrays

    • Objects and Arrays

    • 기타 기능

  • Underscore는 Chrome, Firefox, Edge 및 더.

사용 사례:

  • 필터, 맵 등과 같은 기능 도우미는 물론 바인딩, 빠른 인덱싱, JavaScript 템플릿, 품질 테스트 등과 같은 특수 기능도 지원합니다.

5, Lodash

Lodash는 숫자, 배열, 문자열, 객체 등을 더 쉽게 작업할 수 있게 해주는 JS 유틸리티 라이브러리이기도 합니다. 2013년에 출시되었으며 Underscore.js와 같은 기능적 프로그래밍 디자인도 사용합니다.

기능 및 이점:

  • 은 유지 관리가 가능하고 간결한 JavaScript 코드를 작성하는 데 도움이 됩니다.

  • 수학 연산, 바인딩 이벤트, 함수 제한, 데코레이터, 제약 조건 제한, 디바운싱 등과 같은 일반적인 작업을 단순화했습니다.

  • 트림, 낙타 대문자 사용, 대문자 사용과 같은 문자열 기능이 모두 더 간단해졌습니다.

  • 배열을 생성, 수정, 압축 및 정렬합니다.

  • 컬렉션, 개체 및 시퀀스에 대한 기타 작업.

사용 사례:

모듈형 접근 방식의 도움:

  • 배열, 문자열 및 객체를 반복합니다.

  • 복합 함수를 만듭니다.

  • 작동 및 테스트 값.

6. Algolia Places

Algolia Places는 사이트에서 주소 자동 완성 기능을 사용하는 쉽고 분산된 방법을 제공하는 JavaScript 라이브러리입니다. 이는 사이트 사용자의 경험을 향상시키는 데 도움이 되는 매우 빠르고 정확한 도구입니다. Algolia Places는 OpenStreetMap의 인상적인 오픈 소스 데이터베이스를 활용하여 전 세계에 걸쳐 서비스를 제공합니다.

예를 들어 제품 페이지의 전환율을 높이는 데 사용할 수 있습니다.

특징 및 이점:

  • 여러 입력을 동시에 채워 결제 프로세스를 단순화합니다.

  • 국가 또는 도시 선택기를 쉽게 사용할 수 있습니다.

  • 지도에 링크 추천이 실시간으로 표시되어 빠르게 결과를 확인할 수 있습니다.

  • Algolia Places는 입력 오류를 처리하고 그에 따라 결과를 표시할 수 있습니다.

  • 모든 쿼리를 가장 가까운 서버로 자동 라우팅하여 밀리초 안에 결과를 제공합니다.

사용 사례:

  • 지도를 병합하여 특정 위치를 표시할 수 있어 매우 유용합니다.

  • 양식을 효율적으로 사용할 수 있게 해줍니다.

7. Anime.js

사이트나 애플리케이션에 애니메이션을 추가하고 싶다면 Anime.js는 찾을 수 있는 최고의 JavaScript 라이브러리 중 하나입니다. 2019년에 출시된 이 제품은 가볍고 강력하면서도 간단한 API를 갖추고 있습니다.

기능 및 이점:

  • Anime.js는 DOM 속성, CSS 속성, SVG, CSS 변환 및 JS 개체와 함께 작동합니다.

  • Chrome, Safari, Firefox, Opera 등 다양한 브라우저에서 작동합니다.

  • 소스 코드를 쉽게 해독하여 사용할 수 있습니다.

  • 겹침 및 시차를 두고 따르는 것과 같은 복잡한 애니메이션 방법이 더욱 쉬워졌습니다.

사용 사례:

  • Properties 및 시간에 Anime.js의 인터리빙 시스템을 사용할 수 있습니다.

  • 하나의 HTML 요소에서 동시에 여러 타이밍을 사용하여 계층화된 CSS 전환을 만듭니다.

  • Anime.js 콜백 및 제어 기능을 사용하여 이벤트를 동기식으로 재생, 일시 중지, 트리거, 되감기 및 제어합니다.

8. Animate On Scroll(AOS)

Animate On Scroll은 단일 페이지 시차 웹사이트에 매우 적합합니다. 이 JS 라이브러리는 완전한 오픈 소스이며 위아래로 스크롤할 때 아름답게 보이는 멋진 애니메이션을 페이지에 추가하는 데 도움이 됩니다.

페이드 효과, 정적 앵커 위치 등을 추가하여 웹사이트 디자인을 개선하고 사용자 만족도를 높입니다.

기능 및 이점:

  • 이 라이브러리는 요소 위치를 감지하고 뷰포트에 나타날 때 적절한 클래스를 추가할 수 있습니다.

  • 애니메이션을 쉽게 추가할 수 있을 뿐만 아니라 뷰포트를 변경하는 데에도 도움이 됩니다.

  • 휴대폰, 태블릿, 컴퓨터 등 다양한 기기에서 원활하게 실행됩니다.

  • 순수한 JavaScript로 작성되었으므로 종속성이 없습니다.

사용 사례:

  • 다른 요소의 위치를 ​​기반으로 요소에 애니메이션을 적용합니다.

  • 화면 위치에 따라 요소에 애니메이션을 적용합니다.

  • 모바일에서 요소 애니메이션을 비활성화합니다.

  • 페이드, 뒤집기, 슬라이드, 크기 조정, 앵커 배치 등과 같은 다양한 애니메이션을 만듭니다.

9. Bideo.js

웹사이트 배경에 전체 화면 비디오를 통합하고 싶나요? Bideo.js를 사용해 보세요.

특징 및 이점:

  • 이 JavaScript 라이브러리를 사용하면 비디오 배경을 추가하는 것이 매우 쉽습니다.

  • 이 기능은 보기에도 좋고 다양한 비율과 크기의 화면에서도 잘 작동합니다.

  • 추가된 영상은 사용하는 브라우저에 따라 크기가 조정될 수 있습니다.

  • CSS/HTML을 사용하여 쉽게 구현할 수 있습니다.

사용 사례:

  • 웹사이트에 반응형 전체 화면 배경 비디오를 추가하세요.

10. Chart.js

귀하의 웹사이트나 프로젝트가 데이터 분석 분야와 관련이 있나요?

통계를 많이 제공해야 하나요?

Chart.js는 뛰어난 JavaScript 라이브러리입니다.

Chart.js는 프로젝트에 아름다운 차트를 즉시 추가할 수 있는 디자이너와 개발자를 위한 유연하고 간단한 라이브러리입니다. 이 JS 라이브러리는 오픈 소스이며 MIT 라이센스와 함께 제공됩니다.

특징 및 장점:

  • 우아하고 단순하며 기본 차트를 추가할 수 있습니다.

  • 반응형 웹페이지를 생성하세요.

  • 가벼워서 배우고 구현하기 쉽습니다.

  • 8가지 유형의 차트.

  • 초보자에게 매우 적합합니다.

  • 애니메이션 기능은 페이지를 더욱 상호작용적으로 만듭니다.

사용 사례:

  • 혼합 차트 유형을 사용하여 다양한 데이터 세트로 작업하면서 명확한 시각적 표현을 제공합니다.

  • 로그, 날짜, 시간 또는 사용자 정의 척도로 희소하고 복잡한 데이터 세트를 플롯합니다.

11. Cleave.js

텍스트 콘텐츠의 형식을 지정하려는 경우 Cleave.js가 흥미로운 솔루션을 제공합니다. 입력된 데이터의 형식을 지정하여 입력 필드의 가독성을 향상시키는 더 쉬운 방법을 제공하기 위해 만들어졌습니다.

이렇게 하면 더 이상 패턴을 가리거나 텍스트 서식을 지정하기 위해 정규 표현식을 작성할 필요가 없습니다.

특징 및 이점:

  • 양식을 통해 제출된 일관된 데이터로 사용자 경험을 개선합니다.

  • 신용 카드 번호, 전화 번호, 날짜, 시간 및 숫자에 대해 다양한 형식 지정 유형을 수행할 수 있습니다.

  • 사용자 정의 블록, 접두사 및 구분 기호 형식을 지정합니다.

  • ReactJS 구성 요소 등을 지원합니다.

사용 사례:

  • CSS 선택기를 사용하여 여러 DOM 요소에 cleave.js를 구현합니다.

  • 특정 원래 값을 업데이트하세요.

  • 텍스트 필드의 참조를 가져옵니다.

  • Vue.js, jQuery 및 Playground의 Redux 양식과 함께 작동합니다.

12. Choreographer.js

Chreographer.js를 사용하여 복잡한 CSS를 효율적으로 애니메이션화하세요. CSS가 아닌 애니메이션에 사용할 수 있는 사용자 정의 기능을 더 추가할 수도 있습니다.

이 JavaScript 라이브러리를 사용하려면 npm을 통해 패키지를 설치하거나 스크립트 파일을 추가하세요.

특징 및 장점:

  • 애니메이션 클래스는 단일 애니메이션 데이터를 관리합니다.

  • animationConfig 객체는 각 애니메이션 인스턴스를 구성합니다.

  • 2가지 내장 애니메이션 기능 "변경"과 "확대/축소"가 포함되어 있습니다.

  • "Scale"은 단계적으로 측정된 값을 노드의 스타일 속성에 매핑하는 데 사용됩니다.

  • "변경"은 스타일 속성을 제거하거나 추가합니다.

사용 사례:

  • 즉시 스크롤 애니메이션을 수행합니다.

  • 마우스 움직임을 기반으로 애니메이션을 만듭니다.

13, Glimmer

Glimmer는 가볍고 빠른 UI 구성 요소로 2017년에 출시되었습니다. 강력한 Ember CLI를 사용하며 EmberJS를 구성 요소로 사용할 수 있습니다.

특징 및 이점:

  • Glimmer는 렌더링 및 업데이트에 놀라운 성능을 제공하는 빠른 DOM 렌더링 엔진입니다.

  • 다용도이며 코드를 다시 작성할 필요 없이 현재 기술 스택과 함께 사용할 수 있습니다.

사용 사례:

  • 독립형 구성 요소로 사용하거나 기존 애플리케이션에 웹 구성 요소로 추가할 수 있습니다.

  • DOM 렌더링.

  • 정적 콘텐츠와 동적 콘텐츠를 구별하는 데 도움이 됩니다.

  • Ember의 강력한 성능이 필요하지만 더 가벼운 패키지인 경우 Glimmer를 사용하세요.

14. Granim.js

Granim.js는 부드러운 대화형 그래디언트 애니메이션을 만드는 데 도움이 되는 JS 라이브러리입니다. 이렇게 하면 귀하의 웹사이트가 화려한 배경과 대비되어 눈에 띄게 만들 수 있습니다.

특징 및 이점:

  • 그라디언트는 이미지를 덮고, 독립적으로 작업하고, 이미지 마스크 아래로 슬라이드하는 등의 작업을 할 수 있습니다.

  • 백분율이나 픽셀 값을 사용하여 그라데이션 방향을 맞춤설정할 수 있습니다.

  • 그라디언트 방향을 대각선, 위아래, 왼쪽 및 오른쪽, 방사형 또는 사용자 정의로 설정하세요.

  • 상태 변경에 대한 애니메이션 기간을 밀리초(ms) 단위로 설정합니다.

  • 그라디언트 색상과 위치를 맞춤설정하세요.

  • 캔버스 위치, 소스, 크기 조정 등에 따른 이미지 사용자 정의

  • 포함된 기타 옵션에는 콜백 설정, 이벤트 방출, 그라데이션 제어 방법 등이 포함됩니다.

사용 사례:

  • 2가지 색상의 3가지 그라데이션을 사용하여 기본 그라데이션 애니메이션을 만듭니다.

  • 3가지 색상의 2가지 그라디언트를 사용하는 복잡한 그라디언트 애니메이션.

  • 하나의 배경 이미지, 두 가지 색상 및 혼합 모드를 사용하여 그라데이션에 애니메이션을 적용합니다.

  • 이미지 마스크를 사용하여 특정 모양 아래에 그라데이션 애니메이션을 만듭니다.

  • 이벤트에 반응하는 그라데이션 애니메이션을 만듭니다.

15, fullPage.js

오픈 소스 JS 라이브러리 fullPage.js를 사용하면 전체 화면 스크롤 웹 사이트나 단일 페이지 웹 사이트를 쉽게 만들 수 있습니다. 사용이 간편하며 사이트 섹션 내에 수평 슬라이더를 추가할 수도 있습니다.

특징 및 이점:

  • 다양한 사용자 정의 및 구성 옵션을 제공합니다.

  • react-fullpage, angle-fullpage 및 vue-fullpage와 같은 JavaScript 프레임워크를 지원합니다.

  • 수직 및 수평 스크롤을 활성화합니다.

  • 다양한 화면 크기와 여러 브라우저에 적합한 적응형 디자인.

  • 페이지가 로드되면 자동으로 스크롤됩니다.

  • 비디오/이미지 지연 로딩.

사용 사례:

  • 다양한 확장 기능을 사용하여 기본 기능을 개선하세요.

  • 전체 화면 스크롤 사이트를 만드세요.

  • 한 페이지로 구성된 웹사이트를 구축하세요.

16. Leaflet

Leaflet은 사이트에 대화형 지도를 포함할 수 있는 최고의 JavaScript 라이브러리 중 하나입니다. 오픈 소스이며 모바일 친화적이며 무게는 약 39kb입니다. WordPress용 MapPress 지도 플러그인은 Leaflet을 사용하여 대화형 지도를 강화합니다.

특징 및 이점:

  • 모바일 하드웨어 가속 및 CSS 기능과 같은 성능 기능을 제공합니다.

  • 타일 레이어, 팝업, 마커, 벡터 레이어, GeoJSON 및 이미지 오버레이를 포함한 고유한 레이어.

  • 드래그 팬, 확대/축소, 키보드 탐색, 이벤트 등을 포함한 대화형 기능

  • 레이어 전환기, 속성, 크기 조정 및 확대/축소 버튼과 같은 지도 컨트롤입니다.

  • Chrome, Safari, Firefox, Edge 등과 같은 브라우저를 지원합니다.

  • OOP 기능, HTML 및 이미지 기반 마크업, CSS3 컨트롤 및 팝업을 포함한 사용자 정의.

사용 사례:

  • 더 나은 확대/축소 및 이동, 스마트 폴리곤/폴리라인 렌더링, 모듈식 건물, 클릭 지연 이동 애니메이션을 통해 사이트에 지도를 추가하세요.

17, Multiple.js

Multiple.js는 CSS 또는 HTML을 사용하여 JavaScript 좌표 처리 없이 다양한 요소 간에 배경 이미지를 공유합니다.

결과적으로 더 많은 사용자 상호 작용을 추가하는 놀라운 시각 효과를 생성합니다.

18, Moment.js

Moment.js는 다양한 시간대, 현지 언어로 API 호출 등을 사용할 때 시간과 날짜를 효과적으로 관리하는 데 도움이 됩니다.

날짜와 시간을 검증, 구문 분석, 형식 지정 또는 조작하여 단순화할 수 있습니다.

19, Masonry

Masonry는 훌륭한 JS 그리드 레이아웃 라이브러리입니다. 이 라이브러리는 사용 가능한 수직 공간을 기반으로 적절한 위치에 그리드 요소를 배치하는 데 도움이 됩니다. 일부 인기 갤러리 WordPress 플러그인에서도 이를 사용합니다.

20、전지적

Omniscient.js는 불변 데이터가 포함된 빠른 하향식 렌더링을 위해 React 구성 요소 추상화를 제공하는 JS 라이브러리입니다.

이 라이브러리는 프로젝트를 최적화하고 프로젝트를 원활하게 구축하는 데 도움이 되는 흥미로운 기능을 제공합니다.

21, Parsley

프로젝트에 양식을 추가하시겠습니까?

그렇다면 파슬리가 도움이 될 수 있습니다. 양식의 유효성을 검사하는 데 사용할 수 있는 간단하면서도 강력한 JS 라이브러리입니다.

22. Popper.js

Popper.js는 팝업 메뉴, 드롭다운 메뉴, 도구 설명 및 기타 상황별 요소(버튼 또는 기타 유사한 요소에 더 가깝게)를 더 쉽게 배치할 수 있도록 만들어졌습니다.

Popper는 그것들을 정렬하고, 다른 사이트 요소에 붙이고, 모든 화면 크기에서 원활하게 재생할 수 있는 훌륭한 방법을 제공합니다.

23, Three.js

Three.js를 사용하면 3D 디자인을 즐겁게 만들 수 있습니다. WebGL을 사용하여 최신 브라우저에서 장면을 렌더링합니다. IE 10 이하를 사용하는 경우 다른 CSS3, CSS2 및 SVH 렌더러를 사용하십시오.

24, Screenfull.js

Screenfull.js를 사용하여 프로젝트에 전체 화면 요소를 추가하세요. 인상적인 크로스 브라우저 효율성 덕분에 이 JavaScript 라이브러리를 사용하는 데 문제가 없을 것입니다.

25, Polymer

Google 오픈 소스 JavaScript 라이브러리 – 구성 요소를 사용하여 웹 애플리케이션을 구축하는 데 사용되는 Polymer.

26, VOCA

Voca를 만든 아이디어는 JavaScript 문자열 작업의 고통을 덜어주는 것이었습니다. 대소문자 변경, 패딩, 트리밍, 자르기 등과 같은 문자열을 쉽게 조작할 수 있는 유용한 기능이 함께 제공됩니다.

【관련 권장 사항: javascript 학습 튜토리얼

위 내용은 자바스크립트에는 어떤 라이브러리가 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
React : 현대 프론트 엔드 개발의 기초React : 현대 프론트 엔드 개발의 기초Apr 19, 2025 am 12:23 AM

React는 현대적인 프론트 엔드 애플리케이션을 구축하기위한 JavaScript 라이브러리입니다. 1. 구성 요소 및 가상 DOM을 사용하여 성능을 최적화합니다. 2. 구성 요소는 JSX를 사용하여 데이터를 관리하기 위해 정의, 상태 및 속성을 정의합니다. 3. 고리는 수명주기 관리를 단순화합니다. 4. ContextApi를 사용하여 글로벌 상태를 관리하십시오. 5. 일반적인 오류는 디버깅 상태 업데이트 및 수명주기가 필요합니다. 6. 최적화 기술에는 메모 화, 코드 분할 및 가상 스크롤이 포함됩니다.

React의 미래 : 웹 개발의 트렌드와 혁신React의 미래 : 웹 개발의 트렌드와 혁신Apr 19, 2025 am 12:22 AM

React의 미래는 궁극적 인 구성 요소 개발, 성능 최적화 및 다른 기술 스택과의 깊은 통합에 중점을 둘 것입니다. 1) RECT는 구성 요소의 생성 및 관리를 더욱 단순화하고 궁극적 인 구성 요소 개발을 촉진합니다. 2) 성능 최적화는 특히 대규모 응용 프로그램에서 초점이됩니다. 3) React는 개발 경험을 향상시키기 위해 GraphQL 및 TypeScript와 같은 기술과 깊이 통합 될 것입니다.

React : UI 구성 요소 구축을위한 강력한 도구React : UI 구성 요소 구축을위한 강력한 도구Apr 19, 2025 am 12:22 AM

React는 사용자 인터페이스를 구축하기위한 JavaScript 라이브러리입니다. 핵심 아이디어는 구성 요소화를 통해 UI를 구축하는 것입니다. 1. 구성 요소는 UI 논리 및 스타일을 캡슐화하는 반응의 기본 단위입니다. 2. 가상 DOM 및 상태 관리는 구성 요소 작업의 핵심이며 State는 SetState를 통해 업데이트됩니다. 3. 수명주기에는 마운트, 업데이트 및 제거의 세 단계가 포함됩니다. 성능을 합리적으로 사용하여 최적화 할 수 있습니다. 4. usestate 및 contextapi를 사용하여 상태를 관리하고 구성 요소 재사용 성 및 글로벌 상태 관리를 개선하십시오. 5. 일반적인 오류에는 부적절한 상태 업데이트 및 성능 문제가 포함되며, 이는 ReactDevTools를 통해 디버깅 할 수 있습니다. 6. 성능 최적화 제안에는 메모 사용, 불필요한 재 렌더링 방지 및 사용이 포함됩니다.

HTML과의 반응 사용 : 구성 요소 및 데이터 렌더링HTML과의 반응 사용 : 구성 요소 및 데이터 렌더링Apr 19, 2025 am 12:19 AM

JSX 구문 사용 : JSX 구문을 사용하여 JSX 구조를 사용하여 HTML 구조를 JavaScript 코드에 포함시키고 컴파일 후 DOM을 작동시킵니다. 구성 요소는 HTML과 결합됩니다. React 구성 요소는 소품을 통해 데이터를 전달하고 HTML 컨텐츠를 동적으로 생성합니다. 데이터 흐름 관리 : React의 데이터 흐름은 일방 통행이며, 부모 구성 요소에서 자식 구성 요소로 전달되어 이름을 인사말로 전달하는 앱 구성 요소와 같이 데이터 흐름을 제어 할 수 있도록합니다. 기본 사용 예 :지도 함수를 사용하여 목록을 렌더링하려면 과일 목록 렌더링과 같은 주요 속성을 추가해야합니다. 고급 사용 예 : Usestate 후크를 사용하여 상태를 관리하고 역학을 구현합니다.

React의 목적 : 단일 페이지 응용 프로그램 구축 (SPA)React의 목적 : 단일 페이지 응용 프로그램 구축 (SPA)Apr 19, 2025 am 12:06 AM

React는 사용자 인터페이스를 구축하는 효율적이고 유연한 방법을 제공하기 때문에 단일 페이지 응용 프로그램 (SPA)을 구축하는 데 선호되는 도구입니다. 1) 구성 요소 개발 : 복잡한 UI를 독립적이고 재사용 가능한 부품으로 분할하여 유지 가능성과 재사용 성을 향상시킵니다. 2) 가상 DOM : 가상 DOM과 실제 DOM의 차이를 비교하여 렌더링 성능을 최적화합니다. 3) 상태 관리 : 데이터 일관성 및 예측 가능성을 보장하기 위해 상태 및 속성을 통한 데이터 흐름을 관리합니다.

React : 웹 개발을위한 JavaScript 라이브러리의 힘React : 웹 개발을위한 JavaScript 라이브러리의 힘Apr 18, 2025 am 12:25 AM

React는 Meta가 사용자 인터페이스를 구축하기 위해 개발 한 JavaScript 라이브러리이며 핵심은 구성 요소 개발 및 가상 DOM 기술입니다. 1. 구성 요소 및 상태 관리 : React는 구성 요소 (기능 또는 클래스) 및 후크 (예 : usestate)를 통해 상태를 관리하여 코드 재사용 및 유지 보수를 개선합니다. 2. 가상 DOM 및 성능 최적화 : 가상 DOM을 통해 실제 DOM을 효율적으로 업데이트하여 성능을 향상시킵니다. 3. 수명주기 및 후크 : 후크 (예 : 사용률) 기능 구성 요소가 수명주기를 관리하고 부작용 작업을 수행 할 수 있도록합니다. 4. 사용 예 : 기본 Helloworld 구성 요소에서 고급 글로벌 주 관리 (Usecontext 및

React의 생태계 : 라이브러리, 도구 및 모범 사례React의 생태계 : 라이브러리, 도구 및 모범 사례Apr 18, 2025 am 12:23 AM

React Ecosystem에는 주정부 관리 라이브러리 (예 : Redux), 라우팅 라이브러리 (예 : Reactrouter), UI 구성 요소 라이브러리 (예 : 재료 -UI), 테스트 도구 (예 : Jest) 및 Webpack과 같은 빌드 도구 (예 : Webpack)가 포함됩니다. 이러한 도구는 개발자가 애플리케이션을 효율적으로 개발하고 유지하고 코드 품질 및 개발 효율성을 향상시킬 수 있도록 함께 작동합니다.

React and Frontend Development : 포괄적 인 개요React and Frontend Development : 포괄적 인 개요Apr 18, 2025 am 12:23 AM

React는 사용자 인터페이스를 구축하기 위해 Facebook에서 개발 한 JavaScript 라이브러리입니다. 1. 구성 요소 및 가상 DOM 기술을 채택하여 UI 개발의 효율성과 성능을 향상시킵니다. 2. RECT의 핵심 개념에는 구성 요소화, 상태 관리 (예 : usestate 및 useeffect) 및 가상 DOM의 작동 원리가 포함됩니다. 3. 실제 응용 분야에서 React는 기본 구성 요소 렌더링에서 고급 비동기 데이터 처리에 이르기까지 지원됩니다. 4. 주요 속성 추가 또는 잘못된 상태 업데이트를 잊어 버린 것과 같은 일반적인 오류는 ReactDevTools 및 Logs를 통해 디버깅 할 수 있습니다. 5. 성능 최적화 및 모범 사례에는 React.Memo, 코드 세분화 및 코드를 읽기 쉽게 유지하고 신뢰성을 유지하는 것이 포함됩니다.

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

DVWA

DVWA

DVWA(Damn Vulnerable Web App)는 매우 취약한 PHP/MySQL 웹 애플리케이션입니다. 주요 목표는 보안 전문가가 법적 환경에서 자신의 기술과 도구를 테스트하고, 웹 개발자가 웹 응용 프로그램 보안 프로세스를 더 잘 이해할 수 있도록 돕고, 교사/학생이 교실 환경 웹 응용 프로그램에서 가르치고 배울 수 있도록 돕는 것입니다. 보안. DVWA의 목표는 다양한 난이도의 간단하고 간단한 인터페이스를 통해 가장 일반적인 웹 취약점 중 일부를 연습하는 것입니다. 이 소프트웨어는

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

SublimeText3 영어 버전

SublimeText3 영어 버전

권장 사항: Win 버전, 코드 프롬프트 지원!

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경

PhpStorm 맥 버전

PhpStorm 맥 버전

최신(2018.2.1) 전문 PHP 통합 개발 도구