Yes that sounds good to me! I started the redux topic today so sounds like we are at a very similar spot.
Do you use discord? That would be a good place to chat further. I am also on the codecademy discord
I have account there - SashaL#0601
Hi there,
Here is my solution:
petsek/appointment-planner (github.com)
It is just a minimal product only matching requirements of the codecademy instructions with no further formatting or functions.
Regards
Ok I have sent friend request
I am working on this project and come up with a question. Since we are dealing with contacts and appointments in diffrernt components, why do we need to set the state and function in App? Can we just set states and function in these two components? Can anyone help me with it?
Hi hankgu,
I have just finished the project. I did it as suggested with the two states for contacts and appointments in the top-level App.js. But I totally agree with you. I was wondering as well why put the states into App.js instead of braking them down to the correspoding component. How did you finally do it?
see below my code for the appointment planner. WOOOO!
Keen for some feedback.
Appointment Planner Completed
You can see:
- The working version here: https://appointment-planner-one.netlify.app/contacts
- The repo here: GitHub - TomEddieCobb/appointmentPlanner: codecademy project for appointment planner built with react
added a little bit of styling, some error handling, tried to implement a delete appointment function though couldn’t get it working. I stayed away from the hints and any other help for the best part, then refactored per some hints. Then attempted to add some additional functions after looking on here too.
I think the reason is that setState only re-render child component. So if we deal with the state in child component, it will not render the page which is the part. Btw the project setState method is a little bit aweful. The originla code set state for each property of contact and send them to child component which is messy.
To offer Codecademy feedback for this project, I have a few issues to raise. I am currently about halfway through the project. As we know, there are numerous ways to complete any given task in programming. The instructions for this task are in some ways oddly specific, but not at all helpful in communicating the overall desired functionality of the app. They lead you down a certain route in development with no clear picture of what the end goal is. It would be immensely helpful for learners to have a finished link to see the web app deployed and understand the desired end result. This would help us better plan our strategies for implementation and allow us to compare our solutions to yours, and make us better learners/researchers than copiers.
3 Likes
Hello Everyone,
I have just finished this project, I have noticed a few issues with this project as it uses old dependencies and react is now at v18, So I took it upon myself to complete this project from scratch I didnt download the starter file and used everything up to date so bare that in mind if you take a look at my code.
here it is deployed on netlify : Appointment-planner-build
and here is the git repo: GitHub Repo| Appointment-planner
Let me know what you think and give me feedback to improve!
All the best,
Josh
1 Like
Hi everyone,
I enjoyed this project, didn’t have to cheat but certainly had to problem solve.
Live Netlify version here: https://cavey-appointment-maker-app.netlify.app/contacts
Github repository here: GitHub - T-J-D-Cavey/react-appointment-maker-app: This project is a react app, that allows the user to create a list of contacts, and create appointments with selected contacts.
Any feedback would be welcome!
Hi everyone, I have just finished the project:
I used react-router v6.4.4, hope I did it the right way 
Also, I didn’t use select=‘selected’ in ContactPicker, because of warning: “Use the ‘defaultValue’ or ‘value’ props on select instead of setting ‘selected’ on ”, I used the controlled component instead.
Hi Marty,
I totally share your thoughts and feelings!
I found this project really difficult from the level that I came from and I would never have finished it without looking at the solution! I feel I never had the chance to practice smaller steps before coming to this.
I am glad I am not alone… almost thought to give up…
Hi all,
unfortunately there is no way I would be able to complete this challenge without the solution.
But even with the solution code I bump into this problem (see screen shot attached).
Any idea why?
thanks,
Giuseppe
Hello Everyone,
I really enjoyed completing this project, even though I was also lost at moments and felt as if I hadn’t practiced everything that I needed to do first. When ever I ran into a problem I came here and would look at someone else’s solution on GitHub to get myself unstuck.
Here’s my solution for someone else to be able to do the same in the future or just reply if you would like to leave to feedback
Live on Netlify
Github Repository
Thank you, everyone!!!
Hi everyone! When I first got to this project I was a little overwhelmed so I came to the comments and someone had suggested this tutorial React JS Crash Course - YouTube … It was very helpful and a great refresher of the material we just learned, I learned a few new tricks and it really helped watching an experienced developer work through it. After I finished with that I came back and was much more confident.
github : GitHub - alexis-lv/REACT-APPT-PLANNER
netlify: https://react-appt-planner-aw.netlify.app
Just gone through this. Initially tried to do in browser on the codecademy site however I couldn’t for the life of me get ContactForm or AppointmentForm to render in the browser. Re did it from scratch in VS code and it all worked. Very frustrating.
Hello all - here’s my attempt at the project:
Github: GitHub - blatherdicer/codecademy_react_challenge: React challenge project for Codecademy full stack path.
Netify: https://blatherdicer-codeacad-react-challenge.netlify.app
It wasn’t too bad a project to work through - just a couple of areas that stalled me out and took a bit of head scratching.
The first was the assigning of state variables from useState(). The use of array syntax with square brackets to obtain the return values from useState like this: const [contact, setContact] = useState(“”) is inconsistent with how it works for destructuring props, for example: const {appointments, contacts, addAppointment} = props; (Note the square brackets). It took ages to work out that just swapping for {} would make everything work - a weird design decision by the React authors I think.
The second was getting the contactPicker component working properly with a default value. Using Select as a controlled input field with a working default proved fiddly and took ages to sort out. There are many overly complex pieces of advice online, so I guess this is something that confuses many? - My final solution seems to work well and is fairly simple.
Overall a good project for cementing React understanding.
1 Like
Hi!
I’m having some confusing trouble with this. I have been unable to get any code I write to render in the browser at all. That includes changing the code provided that I know works. I’ve tried changing the text for Contacts and Appointments in the nav bar and no changes are reflected. I initially thought something about my contacts pages or contacts form code was incorrect so I checked those against the solution and while slightly different there wasn’t anything glaring.
Is there something I’m doing wrong? I can try to reset the workspace but prefer not losing the work I’ve done if I can avoid it.
Thanks!