algolia/autocomplete

어떤 프로젝트인가요?

핵심 기능

• 01컨테이너와 getSources 함수만 제공하면 작동하는 검색창을 만들 수 있습니다.
• 02키보드 탐색 및 ARIA 속성을 갖춘 접근성 있는 입력 필드를 생성합니다.
• 03결과를 원하는 DOM 마크업으로 직접 렌더링할 수 있습니다.
• 04최근 검색어, 검색어 추천, Algolia Insights용 플러그인을 제공합니다.
• 05일반 JavaScript, Preact, React, Vue에서 작동합니다.

활용 사례

• 문서 사이트나 콘텐츠 웹사이트에 입력 중 검색창을 추가합니다.
• 사이트 검색창에 최근 검색어와 검색어 추천을 표시합니다.
• 결과를 직접 렌더링하는 커스텀 콤보박스나 명령 팔레트를 만듭니다.

빠른 시작

1. 1

   npm으로 autocomplete-js 패키지를 설치합니다

   npm install @algolia/autocomplete-js
2. 2

   HTML에 컨테이너 div를 추가합니다

3. 3

   autocomplete를 가져온 다음 컨테이너와 getSources 옵션을 전달해 호출합니다

사용 전 알아둘 점

• !기본 설정 이상의 결과를 표시하려면 소스와 렌더링을 직접 구현해야 합니다.

토픽

자주 묻는 질문

autocomplete은(는) 무엇인가요?

자체 소스와 DOM 렌더링을 활용해 자동 완성 및 입력 중 검색창을 만드는 JavaScript 라이브러리입니다. Autocomplete는 자동 완성 검색 환경을 구축하기 위한 JavaScript 라이브러리입니다. 컨테이너 요소와 표시할 추천 항목을 반환하는 getSources 함수를 제공하면, 라이브러리가 입력 필드를 만들고 키보드 상호작용과 접근성 속성을 처리합니다. 결과 마크업은 직접 제어할 수 있습니다.

autocomplete은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

autocomplete은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

autocomplete은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. autocomplete의 마지막 커밋은 2026년 10월 7일입니다.

autocomplete은(는) 어디에 사용할 수 있나요?

문서 사이트나 콘텐츠 웹사이트에 입력 중 검색창을 추가합니다. 사이트 검색창에 최근 검색어와 검색어 추천을 표시합니다. 결과를 직접 렌더링하는 커스텀 콤보박스나 명령 팔레트를 만듭니다.

autocomplete는 어떻게 설치하나요?

npm으로 autocomplete-js 패키지를 설치합니다: npm install @algolia/autocomplete-js HTML에 컨테이너 div를 추가합니다 autocomplete를 가져온 다음 컨테이너와 getSources 옵션을 전달해 호출합니다

autocomplete은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/algolia/autocomplete