Implementing Website Search with Vue.

This page summarizes the projects mentioned and recommended in the original post on dev.to

SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
surveyjs.io
featured
InfluxDB - Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com
featured
  • axios

    Promise based HTTP client for the browser and node.js

  • As observable in the code above we use axios to make HTTP calls to our API.

  • vuex-persistedstate

    Discontinued πŸ’Ύ Persist and rehydrate your Vuex state between page reloads.

  • On the second tip you would query your server for all the items that exist in it and store them locally with the help of vuex and a persistence plugin such as vuex-persistedstate so that when the user reloads the website the data wont be lost. Afterwards for every subsequent search that will be performed by users the queries would be made to the item data pre-fetched and locally stored on the browser instead of making a new API call to your server on each search request. A point to be noted here is that this is a sound application if your database isn't being updated throughout the day, otherwise your users won't be able to query for the new added data.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • vue-router

    🚦 The official router for Vue 2

  • When you apply this search feature in a VueJs project the search results will likely have links to other pages just as you would on any other web project, to dismiss them as you navigate to the other page you'll need to listen to the changes happening to vue-router's $route.path property as follows:

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts

  • vue ァーバーからデータを取得して葨瀺する

    3 projects | dev.to | 15 Oct 2021
  • Trying Vue without NPM

    2 projects | dev.to | 28 Mar 2021
  • React Magic: How to Create a Custom Hook for Seamless Data Retrieval.

    1 project | dev.to | 30 Apr 2024
  • Update Bunny Edge Storage files with NodeJS

    2 projects | dev.to | 30 Apr 2024
  • API Handling: Utilizing the Facade Pattern with Axios in Frontend Development

    2 projects | dev.to | 25 Apr 2024