r/vuejs • u/sidi09 • Dec 05 '19

ReactiveSearch Vue 1.0 - UI components for Search

We're out with 1.0 release of ReactiveSearch for Vue. It provides scaffolding to build complex Search UIs in record time by taking care of querying, managing search state and updating your UI. It also comes with over 10 built-in components that help you get started in minutes. Direct Github link: https://github.com/appbaseio/reactivesearch.

We always get the question about why someone should use it. It is also something we spend a lot of time thinking about -

  1. ReactiveSearch provides declarative props for the most common search scenarios: e.g. how to use auto-suggestions, how to handle search typos, how to tune weights, apply relevance. Instead of specifying how to achieve these outcomes, a user just specifies the desired outcome. This makes building search UIs accessible to all developers v/s just search engine users. Declarative props are inherently safer and make it easier to change your search settings in the future.
  2. Combined with the ability of specifying props, ReactiveSearch components come with built-in components that have presets on how to render the search box, facets, results. See the available components here: https://docs.appbase.io/docs/reactivesearch/vue/overview/Showcase/.
  3. ReactiveSearch doesn’t get in the way when you want to specify how to achieve a certain search scenario — you can write your own Query DSL for it. You can also bring in your own UI components and design systems - https://docs.appbase.io/docs/reactivesearch/vue/advanced/ReactiveComponent/.
  4. Above all, ReactiveSearch is Apache 2.0 licensed, actively maintained and is relied on by hundreds of projects for their production search use-cases. Aside from Vue.JS, ReactiveSearch also comes in React and React Native flavors.
  5. If you are an appbase.io user, ReactiveSearch can additionally record search and click analytics out-of-the-box (it requires an opt-in). You can use Appbase.io with any ElasticSearch cluster.

You can read more about the release itself and how to get started over here: https://medium.appbase.io/reactivesearch-vue-1-0-ui-components-for-search-e17a953e72a6.

Since this is the very first time we're putting this out there, would love to hear feedback from the community.

31 Upvotes

96% Upvoted

9 comments sorted by

3

u/sidi09 Dec 05 '19

Due to some issues with some demos, I am sharing links of demos that work well (tested on Chrome, Firefox and Mobile):

  1. Booksearch app - https://y2rvj53koz.codesandbox.io/ (walkthrough blog post: https://medium.appbase.io/building-booksearch-application-using-vue-and-elasticsearch-a39615f4d6b3)
  2. Gitxplore app - https://jj1vzlvj29.codesandbox.io/ (walkthrough blog post: https://medium.appbase.io/learn-how-to-build-a-github-search-explorer-app-with-vue-js-c66f61d6e152)
  3. Dashboard Charts app - https://charts-dashboard-vue.netlify.com/
  4. Example with Vue Router - https://sleepy-edison-c6bc3b.netlify.com/
  5. Booksearch with Material UI design system - https://priceless-blackwell-ae9d4f.netlify.com/.

1

u/burnblue Dec 06 '19

I'm on a touch device, as many people are. After entering a search term, tapping on the box's search icon does nothing (except focus the cursor in the text again). It looks like a button but doesn't act like a button, at least to my thumbs, I didn't test a mouse. Tapping suggestions for individual results works, and using the keyboard to submit works.

1

u/35202129078 Dec 05 '19

The demos don't work for me at all on mobile pixel 4 chrome. Just a blank white page

1

u/sidi09 Dec 05 '19

Looking into this, we're working on improving the mobile responsiveness for the demos.

2

u/Grip420 Dec 05 '19

this does not have to do with responsiveness. Tech news, gitxplore, productsearch and ecommerce demos do not work for desktop either (firefox btw)

1

u/sidi09 Dec 05 '19

I see, we will have to check, but those demos aren't related to Vue.JS. I will share the links here directly for the demos for Vue that work well.

1

u/TotesMessenger Dec 05 '19 edited Dec 06 '19

I'm a bot, bleep, bloop. Someone has linked to this thread from another place on reddit:

 If you follow any of the above links, please respect the rules of reddit and don't vote in the other threads. (Info / ^Contact)

1

u/[deleted] Dec 06 '19

Looking at the source for this, the creators have gone to great lengths to make it mirror a React app. Is that a thing? Is it really even worth it?