• reduce height of header (class header)
• reduce the dimension of svg logo (class logo)

As USER I would like to copy and paste the URL of my GPX or FIT file.
At the moment the user can upload the file.

In order to cache json of contributors and avoid rate limits by the GitHub API, we could implement a script (in script directory) in Javascript language launched via node, that:

• retrieve list of contributors from GitHub
• Filter contributors where type == "User"
• Map only fields needed (login, avatar_url, html_url, site_admin, contributions)
• save this information in json file and make it available for Contributors.md auto generation and Contributors.vue module for /contributors page.
• save it as contributors.json in pubic directory

Fit2Geojsn will be presented in an Hacktoberfest Event (https://hacktoberfest.digitalocean.com/events in Italy. For this reason we would like to promote the event creating a link in the home page (maybe in the footer).

The event in North East Italy https://www.eventbrite.it/e/biglietti-hacktoberfest-in-h-farm-75475488217

When a geojson is created from FIT file, show a Download button to download the Geojson file

Visualize the Geojson produced by the transformation process on a map
When a goejson is ready, the user can download the geojson or convert it into CSV.
Add a CTA (switch, button , href) to switch into a Map view mode.

• Intro for FIT and GPX file
• Upload FIT/GPX file
• Convert file
• Download Geojson
• Some suggestion on Geojson file (format , where to use it).

It would be a markdown file and could be loaded by VUE under /documentation route.

Share some thoughts about a better UI considering:

• we need a header for logo, title and maybe a main action
• wide body with drag and drop section for upload file
• input text for URL with gpx and fit file (with upload call to action)
• small footer with the link to github

The current design is:

Add a static sitemap.xml for the URLS:

• /
• /contributors

Some other url will be added

Remove banner in App.vue file.
The banner is included in the div:
div id="banner"

Be sure to "clean" also css styles related to banner class.

As suggested by @mtrunt we need to change the CTA on download button

Implement logic to export data uploaded into CSV .
We will need a UI to allow to the user to select the export format (Geojson - default- , or CSV).

When no file or incorrect file is uploaded, the error message is displayed at the top. This hides the download button and user would have to scroll down to upload another file. This is not user intuitive.

Add a meta tag in index.html
The value of content needs to be loaded via env and not hardcoded in html.

Once #34 is implemented we need a UI to allow to the user to select the export format.
The default is geojson (so it doesn't have impact on the UX).
Add a UI component (select, radio ...) to select export format

We could setup a minimal workflow in order to enable GitHub Actions.
The goal for this task is to allow in the future to implement new pipeline/workflow for lint checking, check build, launch tests, release a new version.

This issue is for a minimal setup of GitHub Actions.

Include https://vue-chartjs.org/ to create some POC for charting.
Suggestion is to create a view (route /charts) that acts on geojson stored in the store (vuex).
So when we translate the FIT file into geojson , please start using the Store and commit the geojson into Vuex

REview some metatag HTML for a better sharing like:
in public/index.html we have now:

    <meta
      name="description"
      content="Convert your FIT and GPX file to Geojson"
    />
    <meta
      name="image"
      content="https://fit2geojson.netlify.com/fit2geojson.png"
    />
    <!-- Schema.org for Google -->
    <meta itemprop="name" content="Fit 2 Geojson" />
    <meta
      itemprop="description"
      content="Convert your FIT and GPX files to Geojson"
    />
    <meta
      itemprop="image"
      content="https://fit2geojson.netlify.com/fit2geojson.png"
    />
    <!-- Twitter -->
    <meta name="twitter:card" content="summary" />
    <meta name="twitter:title" content="Fit 2 Geojson" />
    <meta name="twitter:creator" content="@rmeetsh" />

    <meta
      name="twitter:description"
      content="Convert your FIT and GPX files to Geojson"
    />
    <meta name="twitter:site" content="@rmeetsh" />

    <meta name="twitter:image"
    content="https://fit2geojson.netlify.com/fit2geojson.png"" />
    <!-- Open Graph general (Facebook, Pinterest & Google+) -->
    <meta property="og:title" content="Fit 2 Geojson" />
    <meta
      property="og:description"
      content="Convert your FIT and GPX files to Geojsonn"
    />
    <meta
      property="og:image"
      content="https://fit2geojson.netlify.com/fit2geojson.png"
    />
    <meta property="og:url" content="https://fit2geojson.netlify.com/" />
    <meta property="og:site_name" content="Fit 2 Geojson" />
    <meta property="og:type" content="website" />

Create a Nodejs script in script directory named contributors.js that:

• calls https://api.github.com/repos/roberto-butti/fit-geojson-vuejs/contributors
• with the response (if status code 200) obtain a js object considering the format: https://developer.github.com/v3/repos/#response-if-repository-contains-content
• generate a CONTRIBUTORS.md:

To generate CONTRIBUTORS.md:

• filter only items type == "User"
• display login, avatar_url, html_url, contributions and site_admin

Exclude .env file from git.
You need to add into .gitignore file the .env (we already ignore some .env.*)

prepare all things for release 0.2.0:

• create branch gco -b release/100-release_0_2_0
• update package.json
• update contributors.md with script/contributors.js
• removing banner as requested by #98
• create tag git tag -a v0.2.0 -m "version 0.2.0"

Update the Download label based on "selectedFormat", so the user will read "Download Geojson" or "Download CSV "

User Story: As developer, I would like to have a file where store some environment/configuration parameters.
For example we have this need for Proxy URL parameter. Maybe the proxy URL could be the first one parameter placed in this config file.

Move the URL of proxy, in a kind of configuration file (.env or something else), just to allow to the developers to customize with a proxy that he own (it is important for privacy reason, the data is sending to 3rd party proxy service)

suggestion are appreciated

Try to add validation on uploading file.
For example using:
https://www.dropzonejs.com/#config-acceptedFiles

We are using vue2-dropzone for file upload UI

In order to avoid CORS problem during parsing remote FIT or GPX file (via URL) we are using 3rd party service.
Try to think a solution using netlify functions (we are using netlify for developing html frontend).

Maybe this article could be useful ? https://alligator.io/nodejs/solve-cors-once-and-for-all-netlify-dev/

In order to celebrate and say thank you to Open Source Contributors I would like to create a route /contributors where list the contributors.
API to retrieve Contributors: https://api.github.com/repos/roberto-butti/fit-geojson-vuejs/contributors
The format of the response: https://developer.github.com/v3/repos/#response-if-repository-contains-content

To generate the list of contributors:

• filter only items type == "User"
• display login, avatar_url, html_url, contributions and site_admin

In Readme , after cloning the repository we need to add 1 step to allow the developer to have the right configuration locally ( .env file). To do that we need to add a step to copy .env.dist into .env

cp .env.dist .env

Once you have uploaded a FIT file and it is converted into Geojson, you can see the Charts.
In the STATE is stored the Geeojson and this is used for displaying the chart.
This is done only for FIT files. But the Geojson is done also for GPX file. So try to create the Chart also when you start from GPX.

The User needs to see some feedback when he uploads a not valid file.
Better UI for error messages (url not valid or file upload is not the correct format)

WE would like to start to implement some "connector" functionalities to 3rd party services.
Now the user can download locally in his computer the geojson in 2 format (geojson and csv).
WE would like to allow the user to select the 3rdparty service and connect directly fit2geojson to 3rdparty connecter. Keep in mind:

• We are in the frontend JS so the API we would like to integrate needs to allow traffic for CORS
• each 3rd party service has its own logic and its own app_id or secret or code.

For XYZ HUB API:

• We need to ask to the user APP_ID and APP_CODE
• we need to create a space and then create features related to this space
  DOC: https://developer.here.com/documentation/xyz/map_customization_suite_hlp/dev_guide/topics/quick-start-create-new-geo.html

Allow Drag n' Drop to upload FIT files