A creative way to keep a diary of your journeys.
A static website that parses markdown files and images, that depict one's journey/vacations, to project them on a globe. Built with React, Mapbox, JavaScript, and CSS.
This project is currently in development.
- Parse countries from markdown and colorize them
- Highlight active country boundaries
- Display a pop-up with country info
- Sidebar to select different trips
- Trip summary displayed on sidebar
- Auto focus first country when trip changes
- Support embeded videos on country pop-ups
- Add about section
- Auto find available markdown files
- Support for (graphical) paths and country ordering
- Add regional boundary functionality
- Add city functionality
- Markdown folder structure
- Port to containerized web app with interactive creation tools
https://ctsiaousis.github.io/country-chalkboard/.
Clone down this repository. You will need node and npm installed globally on your machine.
Installation:
npm install
To Start Server:
npm run start
To Visit App:
localhost:3000/country-chalkboard
- Clone the repository:
git clone https://github.com/ctsiaousis/country-chalkboard - Change dir:
cd ./country-chalkboard - Create new local branch named $USERNAME-trip:
git checkout -B ctsiaousis-trip cd ./src/markdown- Create a markdown file named
$USERNAME.mdand compose your trip like the examplemyTrip.md - Add desired pictures in the
/src/markdown/picturesfolder - Add and commit your changes:
git add . && git commit -m "my awsome trip" - Push your changes:
git push origin $USERNAME-trip(your branch name) - Create a pull request to include them in the upstream
This was a two week long project built during my 2022 vacation. The goal was to initially deploy it as a static website that utilizes Github Pages and can be forked by anyone to post their trips/vacation etc. I might sometime create a propr web application for it with users, online edit, commenting, notifications and so on.
See CONTRIBUTING.md.