Handing in Project Happy Thought - #55
Conversation
| <Route path="/" element={ | ||
| <> | ||
| <header className="mt-10 text-center text-sm text-gray-500"> | ||
| created by Rebecca Sighed | | ||
| <Link | ||
| to='/about' | ||
| className="text-[#ff7a63ff] underline hover:text-red-700" | ||
| > | ||
| About this app | ||
| </Link> | ||
| </header> | ||
| <ThoughtForm addThought={addThought} /> | ||
| <ThoughtList thoughts={thoughts} | ||
| onLike={handleLike} /> | ||
|
|
||
| </> | ||
| } /> | ||
|
|
||
| {/* About-page: Only shows the About component */} | ||
| <Route path="/about" element={<About />} /> | ||
|
|
||
| </Routes> |
There was a problem hiding this comment.
So nice with this extra route, explaning the project. I liked it a lot! :)
| @@ -0,0 +1,37 @@ | |||
| import { formatDistanceToNow } from 'date-fns'; | |||
There was a problem hiding this comment.
There are really many ways to display time, this was a new one for me :)
| const API_URL = 'https://happy-thoughts-api-4ful.onrender.com/thoughts'; | ||
|
|
||
| export const fetchThoughts = async () => { | ||
| const response = await fetch(API_URL); | ||
| if (!response.ok) throw new Error('Failed to fetch thoughts'); | ||
| return response.json(); | ||
| }; | ||
|
|
||
| export const postNewThought = async (message) => { | ||
| const response = await fetch(API_URL,{ | ||
| method: 'POST', | ||
| headers: {'Content-Type': 'application/json'}, | ||
| body: JSON.stringify({ message: message }) | ||
| }); | ||
| if (!response.ok) throw new Error('Could not send the thought'); | ||
| return response.json(); | ||
| }; | ||
|
|
||
| export const likeThought = async (id) => { | ||
| const response = await fetch(API_URL + "/" + id + "/like", { | ||
| method: 'POST', | ||
|
|
||
| }); | ||
| return response.json(); | ||
| }; |
There was a problem hiding this comment.
Great to have this in a separate file, makes it more readable and easy to follow 👌🏽
| createdAt: new Date().toISOString() | ||
| }; | ||
| setThoughts([newToughtObject, ...thoughts]); | ||
| }; */ |
There was a problem hiding this comment.
Maybe you forgot to delete this commented out code ;)
marinalendt
left a comment
marinalendt
left a comment
There was a problem hiding this comment.
Really nice work Rebecca, as always! Your code is to nice and easy to read, its well organized. I really like that you tried out the react route :D The infopart, gives it a nice twist! Also nice that you used Tailwind.
I saw that you forgot a commented out part in your Thoughtslist, maybe delete that one.
Otherwise, great job, and keep ut the good work! :D
| created by Rebecca Sighed | | ||
| <Link | ||
| to='/about' | ||
| className="text-[#ff7a63ff] underline hover:text-red-700" |
There was a problem hiding this comment.
#ff7a63ff is the same as just #ff7a63 :).
The last two just defines the opacity.
| @@ -0,0 +1,25 @@ | |||
| const API_URL = 'https://happy-thoughts-api-4ful.onrender.com/thoughts'; | |||
There was a problem hiding this comment.
One central place for the api url and the api methods, nice!
Npahlfer
left a comment
Npahlfer
left a comment
There was a problem hiding this comment.
Generally very good, you even used the react router before we started with it, nice! I would have wanted to see some of the stretch goals though :).
Also nice that you are mixing it up with tailwind. Good job!
3 participants
https://happy-thoughts-app-technigo.netlify.app/