search

andrew-bierman / PackRat

PackRat is a versatile adventure planner tailored for outdoor enthusiasts. It simplifies the process of organizing trips from a simple day hike to cross-country journeys.
https://packrat.world/
Other
15 stars 33 forks source link
adventure hiking maps nodejs organization outdoors planning react-native skiing social

readme

PackRat 🎒

PackRat is the ultimate adventure planner designed for those who love to explore the great outdoors. Our app helps users plan and organize their trips with ease, whether it's a weekend camping trip, a day hike, or a cross-country road trip.

With PackRat, you can create and manage trips, discover new destinations, and stay informed with up-to-date weather forecasts. Our app integrates with Mapbox to provide you with accurate maps and directions to your destinations, as well as suggestions for popular outdoor activities based on the location and season of your trip.

So pack your bags, grab your friends, and get ready for your next adventure with PackRat!

[!NOTE] This project is currently in alpha. Please report any issues or bugs you encounter. Thank you for your patience and support!

[!IMPORTANT] This project is still in development and may contain bugs or issues. Please use the app with caution and report any problems you encounter. Thank you for your understanding and cooperation.

Build & CI: Node.js CI Node.js CI for Dev Environment Docker Image CI android-build-apk

Repository Info: GitHub tag License issues - PackRat

[![View Beta Site](https://img.shields.io/badge/View%20Beta%20Site-%20-brightgreen)](https://packrat.world)

Table of Contents

Overview 🌐

With PackRat, you can:

So pack your bags, grab your friends, and get ready for your next adventure with PackRat!

Documentation 📚

[!WARNING] While the app is in alpha, please be aware that there may be bugs or issues. We appreciate your patience and support as we work to improve the app. Data may be lost or corrupted during this time, so please use the app with caution. Thank you for your understanding and cooperation.

view - Documentation

Features 🚀

Technologies used 💻

PackRat is built using the following technologies:

🗂 Folder layout

The main folders are:

UI Kit

Note we're following the design systems guide and creating our own package for components.

See packages/ui named @packrat/ui for how this works.

🆕 Add new dependencies

Pure JS dependencies

If you're installing a JavaScript-only dependency that will be used across platforms, install it in packages/app:

cd packages/app
yarn add date-fns
cd ../..
yarn

Native dependencies

If you're installing a library with any native code, you must install it in expo:

cd apps/expo
yarn add react-native-reanimated
cd ..
yarn

Update new dependencies

Pure JS dependencies

yarn upgrade-interactive

You can also install the native library inside of packages/app if you want to get autoimport for that package inside of the app folder. However, you need to be careful and install the exact same version in both packages. If the versions mismatch at all, you'll potentially get terrible bugs. This is a classic monorepo issue. I use lerna-update-wizard to help with this (you don't need to use Lerna to use that lib).

You may potentially want to have the native module transpiled for the next app. If you get error messages with Cannot use import statement outside a module, you may need to use transpilePackages in your next.config.js and add the module to the array there.

Local installation 📲

PackRat consists of two main components: a client and a server. Follow the steps below to install and run both components.

Dependencies

Environment Setup

  1. Clone the repository: HTTPS:
git clone https://github.com/andrew-bierman/PackRat.git

SSH:

git clone git@github.com:andrew-bierman/PackRat.git
  1. Navigate to the PackRat directory:
cd PackRat
  1. Set up the environment variables for the client and server.
    • If you have access to the development env files, use those. Otherwise, replace the values with your own.
    • See the .env.example files in the apps/expo and server directories for the necessary environment variables.

Automated Setup (Unix) 🛠️

  1. Run the setup script from the PackRat directory. 
    yarn setup

Manual Setup 📝

  1. Navigate to the PackRat directory if you are not already there.

  2. Navigate to the apps/expo directory.

cd apps/expo
  1. Duplicate the .env.example file and rename it to .env. Open the file and replace the values with your own.
    • If you have access to the development env file, skip this step. Otherwise, replace the values with your own.
cp .env.example .env
  1. Duplicate the app.example.json file and rename it to app.json. Open the file and replace the MAPBOX_DOWNLOADS_TOKEN_FROM_ENV value with your own Mapbox API key.
cp app.example.json app.json
  1. Navigate to the ios directory.
cd ios
  1. Duplicate the Podfile.example file and rename it to Podfile. Open the file and replace the MAPBOX_DOWNLOADS_TOKEN_FROM_ENV value with your own Mapbox access token.
cp Podfile.example Podfile
  1. Navigate to the android directory.
cd ../android
  1. Duplicate the gradle.properties.example file and rename it to gradle.properties. Open the file and replace the MAPBOX_DOWNLOADS_TOKEN_FROM_ENV value with your own Mapbox downloads token.
cp gradle.properties.example gradle.properties
"sk..."
  1. Navigate back to the PackRat directory.
cd ../..
  1. Navigate to one of the client directories such as next, expo, vite.
cd apps/next
  1. Duplicate the .env.example file and rename it to .env. Open the file and replace the values with your own.
    • If you have access to the development env file, skip this step. Otherwise, replace the values with your own.
cp .env.example .env
  1. Navigate back to the PackRat directory.
cd ..
  1. Navigate to the server directory.
cd server
  1. Duplicate the .wrangler.toml.example file and rename it to wrangler.toml. Open the file and replace the values with your own.
    • If you have access to the development wrangler file, skip this step. Otherwise, replace the values with your own.
cp .wrangler.toml.example wrangler.toml
  1. Navigate back to the PackRat directory.
cd ..

Yarn Setup

Recommended to open two terminal windows.

Root

  1. From the mainPackRat directory.
yarn install

Server

  1. Navigate to the server directory.
cd server
  1. Start the server.
yarn start

Client

  1. Navigate to the expo directory.
cd apps/expo
yarn run ios
yarn run android
  1. Navigate to the next directory.
cd apps/next
  1. Navigate to the vite directory.
cd apps/vite
  1. Start the Expo/Next/Vite server.
yarn start

Note that the client and server are designed to run concurrently in development mode.

Debugging 🐛

Debugging Yarn Environment Setup - Windows

Check yarn and node version:

yarn -v
node -v

If node version < 18.0.0:

If yarn version >= 4.0.0:

If you don't have yarn installed:

If yarn version < 4.0.0:

Debugging Client Environment Setup 🐛

Expo
Debugging Dependencies

Additionally, if the error is occurring in nextjs that you check the transpilePackages in next.config.js and check if the problematic package is there.

Debugging Cloudflare Wrangler and D1

Docker Installation 🐳 [Experimental]

PackRat can also be installed using Docker. After setting up the development environment, follow the steps below to install and run the app using Docker.

Dependencies

Installation

  1. Run the following command to start the app
docker-compose build
docker-compose up
  1. Navigate to http://localhost:8081/ to view the app. The server will be running on http://localhost:3000/.
  2. If you encounter errors with edits to files not automatically applying, try running the following commands:
docker-compose down
docker-compose build
docker-compose up
  1. To stop the app, run the following command:
docker-compose down
  1. If you encounter issues with docker-compose, you can build the images manually by running the following commands from the root folder:
docker build -t packrat-client client/Dockerfile
docker build -t packrat-server server/Dockerfile
  1. To run the images, run the following commands:
docker run -p 8081:8081 packrat-client
docker run -p 3000:3000 packrat-server

How backend API's are setup

Please refer to README.md inside server folder.

Contributing 🤝

[!TIP] We have an active community of contributors and users who are happy to help. Join us on Discord to get involved!

Contributions to PackRat are welcome! To contribute, follow these steps:

  1. Clone this repository.
  2. Create a new branch.
  3. Make your changes and commit them.
  4. Push your changes to the remote branch.
  5. Open a pull request.
  6. Wait for your pull request to be reviewed and merged.
  7. Celebrate! 🎉

User Stories:

User Stories 📖 (Click to expand) ## User Features: ### Registration and Authentication: - Users can create an account by accessing the menu and selecting the 'Register' option. Additionally, they have the option to sign up directly from the login page. ### Main Dashboard: - On the main page, users have several options to choose from: - Quick actions - Search for new trails - Access other menu options - View their feed, which displays previously created packs. - Users can search for a destination directly on the main dashboard, which will then redirect them to the maps interface. ### Destination Search: - Users have the capability to search for a destination directly on the main dashboard. - Upon initiating a search, users are redirected to the maps interface for further exploration and planning. ### Accessing Profile Information: - Users can conveniently access their profile information from the menu under the Profile feature. ### Profile User Overview: - The dashboard provides users with a comprehensive overview of their profile. - It prominently displays the user's username and account photo for quick identification. ### Favorite Trips and Packs: - Users have immediate access to their favorite trips and packs directly from the dashboard. - By selecting the "View details" option, users can delve into more details about their favorite trips and packs. ### Profile Management: - Users can effortlessly manage their profile information from the dashboard. - By clicking on the settings button icon, users are directed to the profile settings section where they can make necessary updates seamlessly. ### Appearance Theme Customization: - Users have the option to personalize their experience by changing the theme. - They can choose between light mode or dark mode based on their preference. - Additionally, users have the option to purchase additional themes for further customization. (Note: This feature may require updates.) ### Profile Editing: - Users can easily edit their profile settings by clicking the "show dialog" option. - This allows them to update their name and “food preferences”, with a wide range of options to choose from. (Note: This feature may require updates.) ## Pack Features: ### Pack Creation and Access Settings: - Users are prompted to input a name for their pack when creating it. - Users have the option to choose the accessibility setting for their pack, deciding whether it will be public or private. ### Adding Items to Packs: - When users add an item to the pack, they are required to provide: - The name of the item. - The weight of the item. - The quantity of the item. - The category the item belongs to (food, water, essentials). - After providing the necessary details, users click "Add Item" to include it in the pack dashboard. ### Pack Scoring System: - Users can view their pack score, which is generated based on several criteria: - The total weight of the pack. - The presence of essential items. - The degree of redundancy in items. - The versatility of the items included. ### Navigating to the Dashboard: - Users can easily return to the dashboard by following these steps: 1. Access the menu. 2. Select the "Home" option. ## Trip Features: ### Trip Creation and Management: - Users have two methods for creating a trip: - Directly from the main page dashboard using the quick actions feature. - By navigating to the 'Trips' option in the menu. ### Setting up a Trip: - Users initiate trip setup by selecting their backpacking destination. - Nearby trails and parks are displayed for exploration. - Users can: - Choose gear from their saved packs. - Create a new pack and add items directly on the page. - Select the target date for their trip using a calendar to specify the duration. - A map showcasing the trip destination is provided for reference. - Once all details are confirmed, users: - Save their trip. - Input a name and description. - Choose the trip's accessibility setting (public or private). - A weather forecast and summary of the destination, trails, dates, and trip duration are displayed for easy reference. ### Accessing Saved Trips: - Users can easily access their saved trips from the menu by selecting the 'Trips' option. - Within the 'Trips' section, users can: - Organize their trips by sorting them from favorites to most recent. - Utilize a search bar to quickly locate a specific trip by name. ### Viewing Trip Details: - When users select a trip from the dashboard, they are presented with detailed information including: - The trip's description. - Destination. - Start and end dates. - Additionally, users can: - Conveniently view the weather forecast for the selected dates directly on the same page. - Access the maps interface for further exploration. - At the bottom of the page, users can find the Trip Score, providing an overall assessment of the trip's suitability and preparedness. ## Items Feature: ### Dashboard: - Users are able to view their items used in their saved packs. - They can sort how many items will show up on screen. They can choose from 10, 20, and 50. - Users have the option to add new items. ### Adding Items: - User needs to fill out the following fields: - Item Name - Weight – they can choose the unit of measurement. Includes lb, kg, oz, and g. - Quantity - Category ## Feed Feature: ### Exploring Backpackers: - Users can browse through a list of other backpackers. - Navigate the page using the search and sort options. ### Pack List Interaction: - Upon opening a pack list, users have several options available: - They can view the profile of the backpacker associated with the pack. - Users also have the ability to copy the pack list for their own use. - The pack list includes detailed information such as item name, weight, quantity, and category. ### Item Management: - Users can interact with items on the pack list by: - Editing, deleting, or ignoring items as needed. - The total weight of the pack is dynamically calculated and displayed at the bottom of the page. - Users can easily add new items to the pack list as well. - At the bottom of the page, users can view the Pack Score. ### Returning to Feed Dashboard: - Users can navigate back to the feed dashboard by accessing the menu and selecting the "feed" option.

👏 Special Thanks

License 📝

PackRat is licensed under the terms of the GNU General Public License v3.0. See LICENSE for more information.