{"guid":"7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","title":"Using GeoJSON Data in a Fullstack Vue Application","subtitle":null,"slug":"froscon2021-2674-using_geojson_data_in_a_fullstack_vue_application","link":"https://programm.froscon.de/2021/events/2674.html","description":"This talk will discuss the initial steps in developing a vacation rental application with VueJS, Koa, and ArangoDB. The talk covers what GeoJSON data is, how we used it in our application, and the technologies used for the VueJS frontend. We showcase how to use our built-in full-text search engine ArangoSearch for text information retrieval with the new GeoJSON analyzer.\n\nThis talk will cover three main topics:\nPreparing Data for use in ArangoDB\nUsing GeoJSON data with an ArangoSearch analyzer\nUsing Leaflet \u0026 OpenStreetMap in VueJS applications\n\nPerhaps it is being cooped up in the house for the past year that has us thinking about taking a vacation and that is why we decided to make a vacation rental site to showcase the upcoming ArangoSearch GeoJSON features. Whatever the reason, we learned a lot throughout the process and had a lot of fun making the site with the community. By the end of the talk, you will be able to answer questions such as:\nWhat is GeoJSON?\nHow do I use GeoJSON with my ArangoSearch Views?\nHow do I add an interactive map to my VueJS application?\nHow do I use ArangoDB with my backend node application?\n\nWe have got the site to our first milestone release but it still has a long way to go. If you have any interest in developing with Vue, React, JavaScript, or ArangoDB be sure to join this talk to learn about this project and how you can contribute.\n","original_language":"eng","persons":["Chris Woodward"],"tags":["froscon2021","2674","2021","Web Development"],"view_count":81,"promoted":false,"date":"2021-08-21T16:00:00.000+02:00","release_date":"2021-08-31T00:00:00.000+02:00","updated_at":"2026-02-25T12:15:07.235+01:00","length":2992,"duration":2992,"thumb_url":"https://static.media.ccc.de/media/events/froscon/2021/2674-7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5.jpg","poster_url":"https://static.media.ccc.de/media/events/froscon/2021/2674-7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5_preview.jpg","timeline_url":"https://static.media.ccc.de/media/events/froscon/2021/2674-7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5.timeline.jpg","thumbnails_url":"https://static.media.ccc.de/media/events/froscon/2021/2674-7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5.thumbnails.vtt","frontend_link":"https://media.ccc.de/v/froscon2021-2674-using_geojson_data_in_a_fullstack_vue_application","url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_title":"FrOSCon 2021 Cloud-Edition","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021","related":[],"recordings":[{"size":273,"length":2992,"mime_type":"video/webm","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_webm-hd.webm","state":"new","folder":"webm-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2021-08-31T06:07:47.342+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/webm-hd/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_webm-hd.webm","url":"https://api.media.ccc.de/public/recordings/54692","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"},{"size":77,"length":2992,"mime_type":"video/mp4","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_sd.mp4","state":"new","folder":"h264-sd","high_quality":false,"width":720,"height":576,"updated_at":"2021-08-31T05:25:34.547+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/h264-sd/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_sd.mp4","url":"https://api.media.ccc.de/public/recordings/54657","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"},{"size":103,"length":2992,"mime_type":"video/webm","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_webm-sd.webm","state":"new","folder":"webm-sd","high_quality":false,"width":720,"height":576,"updated_at":"2021-08-31T05:12:35.381+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/webm-sd/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_webm-sd.webm","url":"https://api.media.ccc.de/public/recordings/54650","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"},{"size":45,"length":2992,"mime_type":"audio/mpeg","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_mp3.mp3","state":"new","folder":"mp3","high_quality":false,"width":0,"height":0,"updated_at":"2021-08-31T05:07:02.381+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/mp3/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_mp3.mp3","url":"https://api.media.ccc.de/public/recordings/54645","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"},{"size":30,"length":2992,"mime_type":"audio/opus","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_opus.opus","state":"new","folder":"opus","high_quality":false,"width":0,"height":0,"updated_at":"2021-08-31T05:02:04.071+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/opus/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_opus.opus","url":"https://api.media.ccc.de/public/recordings/54643","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"},{"size":173,"length":2992,"mime_type":"video/mp4","language":"eng","filename":"froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_hd.mp4","state":"new","folder":"h264-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2021-08-31T04:43:14.901+02:00","recording_url":"https://cdn.media.ccc.de/events/froscon/2021/h264-hd/froscon2021-2674-eng-Using_GeoJSON_Data_in_a_Fullstack_Vue_Application_hd.mp4","url":"https://api.media.ccc.de/public/recordings/54626","event_url":"https://api.media.ccc.de/public/events/7b59b648-1e61-4ef8-b5e9-b6a4ec7f2db5","conference_url":"https://api.media.ccc.de/public/conferences/froscon2021"}]}