Skip to content

Conversation

@torshimizu
Copy link

TREK

Congratulations! You're submitting your assignment!

Comprehension Questions

Question Answer
What does it mean for code to be asynchronous? Code runs on the page at different times.
Describe a piece of your code that executes asynchronously. How did this affect the way you structured it? Query searches (and the buttons associated) loads asynchronously. This was difficult as I had to bind events to elements that already existed on the page, meaning that it took a lot more effort to keep code dry and not over specific and to make a function run when the right thing on the page was selected.
What kind of errors might the API give you? How did you choose to handle them? Not an error, but at times the API would return a No Content (204) status, which I chose to handle by displaying 'No trips at this time' where the trip list would be. When receiving a 500 internal server error, I send a specific text message. If it is a POST error, the contents of the error are looped through and printed.
Do you have any recommendations on how we could improve this project for the next cohort? For the optionals, list what the options for the query parameters are - especially when a continent is listed under not its real name (i.e. Australasia)


event.preventDefault();

const reservationURL = baseURL + '/' + $('input[name="id"]').val() + '/reservations'

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good - I like this stored in the hidden field in the form


axios.post(reservationURL, tripData)
.then(() => {
$('input[name="name"]').val(''); // clearing text field

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good - I like this being done only if it succeeds

switch(searchCat) {
case 'continent':
$('#search-filters').html(
`<div class='dropdown'>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd love to see each of these dropdowns returned from separate functions to clean up this function

.then((response) => {
$('#trip-list').empty();
$('#trip-list').append('<h3>All Trips<h3>');
buildTripTable(response);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes this is awesome! I like that the you saw the opportunity to DRY up this code when adding some of the optionals

@kariabancroft
Copy link

TREK

What We're Looking For

Feature Feedback
Core Requirements
Git hygiene Good
Comprehension questions Yes
Functionality
Click a button to list trips Yes
Click a trip to see trip details Yes
Fill out a form to reserve a spot Yes
Errors are reported to the user Yes
Styling Good
Under the Hood
Trip data is retrieved using from the API Yes
JavaScript is well-organized and easy to read Yes! I really like the way you created some helper functions to do some of the DOM manipulation for you. It makes the direct event handling functions easier to read.
HTML is semantic Yes
Overall You did a really nice job hitting the major learning goals of this assignment. I especially liked how you pulled out some of the DOM manipulation functionality into separate functions to use within the event handler functions.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants