GithubHelp home page GithubHelp logo

lightoftwelve / travel-tracker Goto Github PK

View Code? Open in Web Editor NEW
0.0 3.0 0.0 5.38 MB

TravelTracker is a web application that allows users to create and manage their travel itineraries and bucketlists. It provides features such as creating a bucket list of places to visit, planning activities on a calendar, exploring destinations on an interactive map, and checking weather information for selected locations

Home Page: https://lightoftwelve.github.io/travel-tracker/

License: Other

HTML 52.45% CSS 14.54% JavaScript 33.01%
bucketlist bucketlist-application bucketlist-frontend-client dayjs fullstack-developer group-project html-css-javascript javascript jquery lists

travel-tracker's Introduction

About Me

🚀 As a spirited entrepreneur with a rich 15-year journey in UI/UX design, I've now embraced the exciting world of full-stack development. My tech adventure started in Telecommunications Engineering and web development as a leisure pursuit. This path ignited my entrepreneurial spirit, leading to successful ventures in real estate, e-commerce, and software development, creating job opportunities for many others along the way.

💡 Presently, I'm steering the ship as the CTO & Co-Founder of Write Guide AI, where we innovate in AI-driven article and social media content generation, giving business owners and hobbyists the opportunity to free up their time by letting Write Guide AI write blogs and social media content for them! Simultaneously, I am the CEO & Founder Light of Twelve, a unique global gemstone and mineral enterprise. Here, I blend my love for storytelling with spirituality, tarot, astrology, crystal healing, and more, crafting compelling narratives for our audience.

I'm at my best when tackling complex challenges in fast-paced environments, finding great satisfaction in exceeding expectations. This passion fuels my growing interest in full-stack development, adding a new dimension to my skill set. Alongside technical prowess, I bring expertise in project management, business planning, e-commerce, SEO optimization, import/export, and real estate investment.

Join me on this journey as I continue to explore the intersection of technology, creativity, and business acumen, always aiming to push boundaries and inspire innovation.


CSS  React  HTML  JavaScript  d3js  Redux   babel  jquery  typescript  webpack  nextjs  NodeJS  handlebars  mongodb  graphql  MySQL  sequelize  Material UI  bootstrap  Git  jest  openal  canva 

Top Langs

...& more



💻 Current Exciting Projects


Write Guide AI | Ongoing development

Write Guide AI Logo

At Write Guide AI, we're redefining content creation. Imagine inputting a few simple parameters – keywords, desired word count, tone, and title – and watching as our AI swiftly crafts high-quality articles up to 4000 words in under 5 minutes. Our platform extends its prowess to social media, creating posts that engage and resonate. Every piece of content is SEO-optimized, ensuring your message reaches its intended audience effectively.

As we move forward, we're excited to integrate machine learning capabilities for even more nuanced and effective SERP analysis, competitor research, advanced keyword mapping, content suggestions, and more! Our journey is not just about creating content but shaping the future of how digital content interacts with audiences and search engines alike.



Light of Twelve | Established e-commerce platform

A comprehensive worldwide e-commerce platform for gemstone and spirituality enthusiasts with two international warehouses. Built with Shopify and integrates with various payment gateways and shipping providers.

Development Projects for Light of Twelve

  • Tarot Reading App:
    • An intuitive and personalized tarot reading application that provides insights and guidance for users. It utilizes machine learning algorithms and a vast database of tarot interpretations generated based on users' input questions.
  • Birthchart Generator & Daily Horoscopes
    • A birthchart and horoscope generator that provides real-time horoscope data, birth chart calculations, and compatibility analysis. Designed to be seamlessly integrated with the Shopify store.
Write Guide AI Logo


Astrology API | Ongoing Development

An astrology API that provides real-time horoscope data, birth chart calculations, and compatibility analysis. Designed to integrate seamlessly with websites or applications for other business owners and hobbyists to use in their digital platforms, offering their customers top-of-the-line, accurate results.



GitHub Streak


Feel free to explore these projects and provide any feedback or suggestions!


🛠️ Skills

🔧 Throughout my journey, I've acquired a diverse set of skills:

  • Frontend: HTML, CSS, JavaScript, React, Typescript, jQuery
  • Backend: Next.js, Node.js, Express.js, MongoDB (Mongoose), MySQL (Sequelize), API Creation, GraphQL, Handlebars, Amazon Web Services (Lambda, Cloudfront, S3, SQS), Webpack (creating PWAs), C, C#, C++
  • Libraries: Bootstrap, Material UI, Prime React, Materialize, Owl Carousel, jQuery FancyBox
  • Third Party APIs: OpenAI, Google Map Services
  • Common Packages: D3, Chart.js, Editor.js
  • Design: UI/UX, Lightroom, Photoshop, Canva, Midjourney, Dall-E
  • Business: E-commerce, Project Management, Business Planning, Financial Management, Forecasting, Marketing
  • Other: Import/Export, Real Estate Investment, Copywriting, SEO Expertise, SEMrush, SurferSEO, Google Analytics, Google Search Console

...& more

📫 Contact

📧 Want to collaborate or have any questions? Feel free to reach out to me through the following:

Let's connect and create something awesome together!

✍️ Blog

📝 I love sharing my thoughts and insights on my blogs. Here are two captivating blogs from my e-commerce business that not only provide valuable information but also help drive organic traffic through SEO strategies:

  • Learning About Tarot: "Tarot Card Reading: Unlocking the Secrets of the Arcana."
  • The Healing Crystal Guide: "Harnessing the Power of Crystals: Exploring the Healing Energies, Science and History of these fascinating gemstones."

Take a look and let me know your thoughts!

🎉 Fun Fact

⚡️ Fun Fact: Did you know that crystals have been used for centuries for their healing properties and spiritual significance? Different crystals are believed to possess unique energies and can be used for various purposes, such as promoting balance, enhancing focus, or attracting positive energy. From ancient civilizations to modern practices, crystals continue to captivate us with their beauty and metaphysical properties.

travel-tracker's People

Contributors

landdoraine avatar lightoftwelve avatar manjiniabraham avatar stanop09 avatar

Watchers

 avatar  avatar  avatar

travel-tracker's Issues

Add Delete Buttons to Items in Adventures List // Dashboard Functionality

Add Delete Buttons to Items in Adventures List

User Story

AS a user,
I WANT to have delete buttons for each item in the adventures list,
SO THAT I can remove specific items from the list if I no longer want

Acceptance Criteria

GIVEN the adventures list with multiple items,
WHEN I click on the delete button next to an item,
THEN the selected item should be removed from the list, and the list should update accordingly.

Add Picture Functionality on Points of Interest // Map Functionality

Add Picture Functionality on Points of Interest

User Story

AS A developer,
I WANT to view pictures on points of interest in the bucket list app
SO THAT users can associate images with their points of interest.

Acceptance Criteria

GIVEN the bucket list app with points of interest,
WHEN adding or editing a point of interest,
THEN users should be able to view pictures associated with the respective point of interest.

Contact Page // UI UX Design

Design Contact Page

User Story

AS A developer,
I WANT to design a user-friendly Contact page for the bucket list app
SO THAT users can easily reach out to the app's team with inquiries or feedback.

Acceptance Criteria

GIVEN the bucket list app's Contact page,
WHEN a user visits the Contact page,
THEN they should find a well-designed form or contact information that allows them to communicate with the app's team effectively.

Historical Weather : Stylize Weather // // UI UX Design

Stylize Weather

User Story

AS A developer,
I WANT to stylize the weather section of the bucket list app
SO THAT it presents weather information in a visually appealing and easy-to-read format.

Acceptance Criteria

GIVEN the bucket list app with a weather section,
WHEN a user views the weather information,
THEN it should be presented in a visually pleasing manner, ensuring readability and appropriate use of weather-related icons or visuals.

Implement Add Button Functionality // Dashboard Functionality

Implement Add Button Functionality

User Story

AS A developer,
I WANT to implement the functionality for the "Add" button on the bucket list app
SO THAT users can sort values from the dropdown to a list area.

Acceptance Criteria

GIVEN the bucket list app with a dropdown and an "Add" button,
WHEN the "Add" button is clicked,
THEN the selected value from the dropdown should be appended to the list area as a collection item.

Connect Categories in Dashboard to List Sorting Categories // Dashboard Functionality

Connect Categories in Dashboard to List Sorting Categories

User Story

AS A developer,
I WANT to connect the categories in the bucket list dashboard to the list sorting categories
SO THAT users can easily filter and organize their bucket list items based on different criteria.

Acceptance Criteria

GIVEN the bucket list dashboard with categories and list sorting options,
WHEN a user selects a sorting category,
THEN the app should display the bucket list items corresponding to that category.

Add Reset Button to Adventures List // Dashboard Functionality

Add Reset Button to Adventures List

User Story

AS a user,
I WANT to have a reset button in the adventures list,
SO THAT I can easily clear all the items and start over if needed.

Acceptance Criteria

GIVEN the adventures list,
WHEN I click on the reset button,
THEN all the items in the list should be removed, and the list should be empty.

Fix Hide Budget Button // Dashboard Functionality

Fix Hide Budget Button

User Story

AS A developer,
I WANT to fix the issue with the "Hide Budget" button
SO THAT it functions correctly and hides the budget information when desired.

Acceptance Criteria

GIVEN the bucket list app with a "Hide Budget" button,
WHEN a user clicks on the button,
THEN the app should hide the budget information from the display as expected.

Weather Functionality: Ensure Current Weather Appends Correctly to Retrievable Lists (Dashboard Functionality)

Ensure Weather Appends Correctly to Retrievable Lists

User Story

AS A developer,
I WANT to ensure that the weather appends correctly to the retrievable lists on the bucket list app
SO THAT users can view and access the weather information for their selected locations.

Acceptance Criteria

GIVEN the bucket list app with a weather app feature,
WHEN retrieving weather information for selected locations,
THEN the app should append the weather data to the respective lists, ensuring it is displayed correctly and consistently.

Load Data from Local Storage and Append to List // Dashboard Functionality

Load Data from Local Storage and Append to List

User Story

AS A developer,
I WANT to load data from local storage and append it to the list area on the bucket list app
SO THAT users can view previously saved items.

Acceptance Criteria

GIVEN the bucket list app with saved data in local storage,
WHEN the page is loaded,
THEN the app should retrieve the saved data from local storage, parse it, and append the items to the list area as collection items.

Implement Function to Move Labels // Dashboard Functionality

Implement Function to Move Labels

User Story

AS A developer,
I WANT to implement a function to move labels on the bucket list app
SO THAT the labels can be positioned properly based on the input field values.

Acceptance Criteria

GIVEN the bucket list app with input fields and associated labels,
WHEN there is a change in the input field values,
THEN the app should invoke the function to move the labels and adjust their positions accordingly.

Ensure Map Stores Values in Local Storage // Map Functionality

Ensure Map Stores Values in Local Storage

User Story

AS A developer,
I WANT to ensure that the map stores values in local storage on the bucket list app
SO THAT users can retrieve and maintain their map data even after refreshing the page.

Acceptance Criteria

GIVEN the bucket list app with a map feature,
WHEN adding or modifying map data (e.g., points of interest, markers),
THEN the app should store the map data in local storage, allowing users to retrieve and display it when needed.

About Page // UI UX Design

Design About Page

User Story

AS A developer,
I WANT to design an informative and engaging About page for the bucket list app
SO THAT users can learn more about the app's team.

Acceptance Criteria

GIVEN the bucket list app's About page,
WHEN a user visits the About page,
THEN they should find comprehensive and well-presented information about the team behind it.

Add Map Markers // Map Functionality

Add Map Markers

User Story

AS A developer,
I WANT to add map markers to the bucket list app
SO THAT users can visually identify the locations of their points of interest on the map.

Acceptance Criteria

GIVEN the bucket list app with points of interest and a map,
WHEN viewing the map,
THEN each point of interest should be represented by a map marker, indicating its location.

Toggle Budget Field // Dashboard Functionality

Toggle Budget Field

User Story

AS A developer,
I WANT to implement the functionality to toggle the visibility of the budget field on the bucket list app
SO THAT users can show or hide the budget input based on their preference.

Acceptance Criteria

GIVEN the bucket list app with a budget toggle switch and a budget input field,
WHEN the toggle switch is changed,
THEN the app should show or hide the budget input field accordingly.

Featured Posts on Home Screen to Points on the Map // Map Functionality // UI UX Design // Dashboard Functionality

Link Featured Posts on Home Screen to Points on the Map

User Story

AS a user,
I WANT to be able to click on the featured posts on the home screen,
SO THAT I can quickly navigate to the corresponding points on the map and view their locations.

Acceptance Criteria

GIVEN the home screen with featured posts and the map with marked points,
WHEN I click on a featured post,
THEN the application should scroll to the corresponding point on the map and visually indicate the selected point.

Ensure Map Data Appends Correctly to Retrievable Lists // Map Functionality // Dashboard Functionality

Ensure Map Data Appends Correctly to Retrievable Lists

User Story

AS A developer,
I WANT to ensure that the map data appends correctly to the retrievable lists on the bucket list app
SO THAT users can view and access the map data for their points of interest.

Acceptance Criteria

GIVEN the bucket list app with map data,
WHEN retrieving map data,
THEN the app should append the map data to the respective lists, ensuring it is displayed correctly and consistently.

Ensure Calendar Functions Correctly // Calendar Functionality

Ensure Calendar Functions Correctly

User Story

AS A developer,
I WANT to ensure that the calendar functions correctly on the bucket list app
SO THAT users can effectively plan and manage their activities.

Acceptance Criteria

GIVEN the bucket list app with a calendar feature,
WHEN interacting with the calendar,
THEN users should be able to select dates, navigate between months, and view the selected dates accurately.

Update Click Function for List Items // Dashboard Functionality

Update Click Function for List Items

User Story

AS A developer,
I WANT to update the click function for the list items on the bucket list app
SO THAT users can interact with the items and populate the fields with their respective data.

Acceptance Criteria

GIVEN the bucket list app with list items in the list area,
WHEN a user clicks on a list item,
THEN the app should retrieve the associated data from local storage, populate the fields with the data, and perform any necessary UI updates.

Weather & Map Correspondence // Weather Functionality

Weather App Functionality

User Story

AS A developer,
I WANT to implement weather app functionality
SO THAT users can view weather information for their selected locations.

Acceptance Criteria

GIVEN the bucket list app with weather app integration,
WHEN a user selects a location,
THEN the app should retrieve and display the weather information for that location.

Correct Letter Overlapping When Budget Input Is Closed // Dashboard Functionality

Correct Letter Overlapping When Budget Input Is Closed

User Story

AS A developer,
I WANT to correct the overlapping letter issue when the budget input is closed.
SO THAT the budget input field and the rest of the interface display correctly.

Acceptance Criteria

GIVEN the bucket list app with a closed budget input field,
WHEN there is text or letters near the budget input field,
THEN the app should adjust the display to prevent overlapping letters and maintain proper alignment.

Save Data to Local Storage // Dashboard Functionality

Save Data to Local Storage

User Story

AS A developer,
I WANT to implement the functionality to save data to local storage on the bucket list app
SO THAT users can store their input and retrieve it later.

Acceptance Criteria

GIVEN the bucket list app with input fields and a save button,
WHEN a user enters data in the fields and clicks the save button,
THEN the app should retrieve the input values, store them in local storage, and update the list area with the new item.

Stylize Calendar // Calendar Functionality // UI UX Design

Stylize Calendar

User Story

AS A developer,
I WANT to apply styling to the calendar component in the bucket list app
SO THAT it has an attractive appearance that complements the overall design.

Acceptance Criteria

GIVEN the bucket list app with a calendar component,
WHEN a user interacts with the calendar,
THEN it should have visually appealing styling, including appropriate colors, fonts, and layout, to enhance the user experience.

Stylize Map // Map Functionality // UI UX Design

Stylize Map

User Story

AS A developer,
I WANT to stylize the map component in the bucket list app
SO THAT it aligns with the overall design and enhances the user experience.

Acceptance Criteria

GIVEN the bucket list app with a map component,
WHEN a user views the map,
THEN it should have an appealing visual design that matches the app's theme and provides clear and intuitive interaction cues.

Ensure Calendar Stores Values in Local Storage // Calendar Functionality

Ensure Calendar Stores Values in Local Storage

User Story

AS A developer,
I WANT to ensure that the calendar stores values in local storage on the bucket list app
SO THAT users can retrieve and maintain their selected dates even after refreshing the page.

Acceptance Criteria

GIVEN the bucket list app with a calendar feature,
WHEN selecting dates on the calendar,
THEN the app should store the selected dates in local storage, allowing users to retrieve them when needed.

Incorporate Map // Map Functionality

Incorporate Map // Map Functionality

User Story

AS A developer,
I WANT to incorporate map functionality into the bucket list app
SO THAT users can visualize their desired locations for their bucket list items.

Acceptance Criteria

GIVEN the bucket list app with map functionality,
WHEN a user interacts with the map (zooms, pans, etc.),
THEN the map should respond accordingly and allow users to view different locations.

Ensure Mobile Responsiveness // UI UX Design

Ensure Mobile Responsiveness

User Story

AS A developer,
I WANT to ensure that the bucket list app is responsive on various mobile devices
SO THAT users can access and use the app seamlessly on their smartphones or tablets.

Acceptance Criteria

GIVEN the bucket list app,
WHEN accessed on different mobile devices with varying screen sizes,
THEN the app should adapt its layout and components to provide an optimal user experience, ensuring that all content is readable and accessible without horizontal scrolling or visual glitches.

Before and After Dates + Weather // Calendar Functionality

Calendar Functionality with Before and After Dates

User Story

AS A developer,
I WANT to implement calendar functionality with before and after dates
SO THAT users can plan their activities based on the desired time of year and view corresponding weather information.

Acceptance Criteria

GIVEN the bucket list app with a calendar feature,
WHEN a user selects a start and end date,
THEN the app should retrieve weather information for the selected dates and display it to the user.

Homepage // UI UX Design

Design Homepage

User Story

AS A developer,
I WANT to design an attractive and user-friendly homepage for the bucket list app
SO THAT users have a visually appealing and engaging introduction to the app.

Acceptance Criteria

GIVEN the bucket list app's homepage,
WHEN a user visits the homepage,
THEN they should find a visually appealing layout with straightforward navigation and relevant information about the app's purpose.

Make Header Logo Mobile Responsive // UI UX Design

Make Header Logo Mobile Responsive

User Story

AS A developer,
I WANT to make the header logo responsive on mobile devices
SO THAT it is properly displayed and scaled on smaller screens.

Acceptance Criteria

GIVEN the bucket list app with a header logo,
WHEN viewed on a mobile device,
THEN the header logo should adjust its size and proportions to fit the screen without losing its visual integrity.

Implement Slider and Form Select Initialization // UI UX Design

Implement Slider and Form Select Initialization

User Story

AS A developer,
I WANT to initialize the slider and form select components on the bucket list app
SO THAT users can interact with them seamlessly.

Acceptance Criteria

GIVEN the bucket list app,
WHEN the page is loaded,
THEN the slider component should be initialized with the specified options (indicators, height, transition, and interval) and the form select components should be initialized.

Incorporate Labels on Points of Interest // Map Functionality

Incorporate Labels on Points of Interest

User Story

AS A developer,
I WANT to incorporate labels on points of interest in the bucket list app
SO THAT users can easily identify and differentiate between different points of interest.

Acceptance Criteria

GIVEN the bucket list app with points of interest,
WHEN viewing the points of interest,
THEN each point of interest should have a corresponding label displayed, providing clear identification.

Search Function // Map Functionality

Search Function // Map Functionality

User Story

AS A developer,
I WANT to add a search function to the map functionality
SO THAT users can easily find and select locations for their bucket list items.

Acceptance Criteria

GIVEN the bucket list app with a map search function,
WHEN a user enters a location in the search input,
THEN the app should automatically fill in the title and address fields on the bucket list dashboard based on the selected location.

Set Labels Active on Data Population // Dashboard Functionality

Set Labels Active on Data Population

User Story

AS A developer,
I WANT to set labels as active when loading data from local storage on the bucket list app
SO THAT users can see the labels associated with the loaded data.

Acceptance Criteria

GIVEN the bucket list app with loaded data from local storage,
WHEN the data is populated in the respective fields,
THEN the app should set the associated labels as active, indicating the presence of data.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.