Algolia and Nextjs with a custom app (_app)


I am having an issue trying to get Algolia to run in my nextjs app. Specifically I am using a custom app component, _app, to initialize all pages and layouts. I would like to have search work on all or most of my pages and layotus, but in order to do that I need to add instantsearch and getInitialProps to _app and that is where things break down.

I have followed the example found here: Next.js instantsearch with server-side rendering (SSR) which was immensely helpful. I can get search to work on one page by following this example.

Here is a codesandbox to show the state of my work at the moment: determined-waterfall-j06ry - CodeSandbox

Can anyone show me where I’ve gone wrong?

My goal is just to have search in my navbar and for a search to redirect to my marketplace. I’d be all ears if anyone could suggest another way of doing that where I don’t have to mess with _app.

Hi! Could you explain why you need to initialize instantsearch in your app component ?
Maybe I’m not understanding it correctly, but couldn’t you implement the instant search as a component that you’d plug in you UI wherever you need, multiple times if needed ?

Looking forward to your reply!

Thanks for your reply! I’m sure I’m the one misunderstanding this. I wanted to initialize instantsearch in _app.js becuase I am wrapping in layouts and I wanted instant search available in my layout and my component.

I ended up doing just that, but I’ve forgone SSR which I think is fine. It works as far as I can tell.