🌲 Voyageurs 🌲

💻 Creators:

Joshua Soave
Roy Sanfilipo
Bobby Tazioli

🌄 About:

Voyageurs is a single page web application that is used to organize National Parks that the user would like to visit or has already visited.

If you don't have an account, sign up . Once you've logged in, select Add Park to begin adding National Parks to your collection. Add information about each park, such as an image, location, and description, and set a priority from high to low.

Don't be scared of creating too many parks! You can always search for them in the search bar or sort for them by priority.

Happy exploring!

⭐ Features:

The user can:

Create a username and password
log in and log out
Create and add a National Park to their collection of parks
Edit a National Park
Delete a National Park
Search through their National Parks collection
Sort their National Parks by the priority that they would like to visit them

🔧 🔩 🔨 The Build:

Languages:

Javascript
HTML5
CSS

Technologies:

NodeJS
AngularJS
Express
Express-session
Mongoose
Bcrypt

🌞 🌝 Our Timeline:

Day	Tasks
Thurs 6/18	Idea, Mongod cloud setup, Heroku setup, File setup
Sat 6/20	Completed login functionality
Sun 6/21	Completed park restful routes, Started CSS Styling
Mon 6/22	CSS work, bug fixes, started README
Tues 6/23	We originally planned to add some final features, but had to fix some major bugs instead.

💾 Git Strategy:

No pushes to git origin dev or git origin master. EVER.
When you are finished working on changes to your local feature, do a git push origin <name_feature>
Any merge will be done on the site itself by comparing name_feature with dev branch.
Group member who is ready to merge changes should send message in Slack to other group members so we can go over the merge together.
Delete branch once it's been merged.
Whenever any sort of merge is done in github, make sure to do a git pull origin dev.

✨ Want to make your own improvements?

Visit our Github
Clone or download the repository
Open the project in terminal and your text editor of choice
Run npm install
Run mongod
In new terminal tab run nodemon
Get to coding!

💃 Wins:

We came up with a workflow that made the most sense to us. As a group, we decided to meet daily at 11am EST to do our merges. These meeting were also when we would decide what tasks to complete for the day.
We came up with a way to work on the same files separately and then resolve Git issues efficiently. Having this framework for dealing with merge conflicts helped ensure no ones code got overwritten.
We worked together to problem solve bugs together when needed. Most of the time, we would get on zoom together and share our screen to show the bug. We would then work through solutions together. Console.log was our best tool for finding the source of most bugs.
We pivoted when issues came up and solved them. Our original goal was to incorporate an api, but we scaled back in order to deliver a polished product without bugs.
We are proud of this code we come up with to access the park data from inside the user. It initially gave us trouble because we were accessing the park info without going into the user's park array.

router.put('/:id/:index', (req, res) => {
  console.log(req.body);
  Park.findByIdAndUpdate(req.params.id, req.body, {new:true}, (err, updatedPark) => {
    User.findById(req.session.user._id, (error, foundUser) => {
      foundUser.parks.splice(req.params.index, 1, updatedPark)
      foundUser.save((error, data) => {
        res.json(data)
        })
      })
    })
  })

😓 Challenges:

Initial Heroku setup - we misinterpreted the setup instructions. We realized we had not defined our port in the .env files and mongo Atlas configs. We also found out that the names for our mongo database variables did not match up. Once we fixed this issues, things finally worked on Heroku.
When we sorted the data by priority we realized that we needed to set the values of 'priority' to 3, 2, and 1 instead of High, Medium, and Low so that it wouldn't sort alphabetically. This caused a major bug because in our model we still had an enum for High, Medium, and Low. Anytime we created a new park with a priority the object would come back as null. Once we removed the old enum from the model, it solved the issue.
Clearing the form data after you create a park or account was another challenge for us. We figured out that we had to attach it to a createForm.name so we could set it to an empty object in the .then of http requests.
We had an issue with accessing the id of req.session.user. We kept getting an error cannot get property id of undefined. After doing some console logs, we realized our req.session.user was coming back as undefined. This happened because our form had an ng-model of signupUsername and signupPassword instead of username and password like it was in our user model. Using console.log really helped us solve this issue.

router.post('/', (req, res) => {
  req.body.password = bcrypt.hashSync(req.body.password, bcrypt.genSaltSync(10));
  User.create(req.body, (error, createdUser) => {
    console.log(createdUser);
    req.session.user = createdUser;
    res.json(req.session.user);
  })
});

🙏 Future Features:

Utilize National Parks API to give the user the option to search and import that data when adding a park.

📘 Sources:

Info about the national parks for our admin account
Wikipedia

joshuasoave/national-parks