Skip to content

DmitriyHoff/vue-ssr-search-test

Repository files navigation

vue-ssr-search-test

en ru

Search for locations using Nominatim API.

demo

Brief description of the implementation

In this project, server-side rendering (SSR) is implemented using Node + Express.js , without third-party libraries.

To demonstrate the correct operation of server rendering and the hydration process on the client side, several pages have been added using Vue Router .

Pinia is used to manage the application state.

To visualize the search results, it was decided to include the Leaflet library. Since Leaflet functions exclusively in the browser, dynamic import of this library is provided in the onMounted() Vue hook. This solution ensures that the library is loaded only on the client side, avoiding errors related to the absence of a global object window on the server.

Project preparation

npm install

Running an application in Hot-Reload mode for development

npm run dev

Assembling a ready-made solution

npm run build

Building and running the production version

npm run preview

Structure of the finished project:

demo