fix: update links and images in book and lighthouse posts

- Updated links in 'your-music-and-people.md' and 'book-metadata.md' to point to the correct resources.
- Changed image paths in 'book-metadata.md', 'lighthouse.md', and 'read.md' to reflect new directory structure.
- Added new images for book metadata and lighthouse performance metrics.
- Removed outdated images related to reading notes.

data/books/your-music-and-people.md

@@ -141,7 +141,7 @@ You are lifted by the people around you.
 
 ## Money
 
-[Pour your personality and philosophy into the way you do business.](../posts/my-utopia)
+[Pour your personality and philosophy into the way you do business.](../posts/transparent-business)
 
 Derek's pricing for a gig, 2000$/h for an hour, 1500$/h for two hours. "You pay me to get there, I enjoy the rest!"
 

data/posts/book-metadata.md

@@ -8,7 +8,7 @@ If you like to take notes from the books you read and know a little bit of JavaS
 
 I've been using Apple Notes, Notion, sticky notes, and paper for my notes. They were unorganized and hard to index when needed. I moved all to Markdown, and started publishing on this website.
 
-[Taking notes is the hard part](../posts/how-do-I-read).
+[Taking notes is the hard part](../posts/read).
 Once they are in place, making them look pretty is a joyful task to deal with. That's what I did while building the book pages, without spending too much effort on details. It took me half-a-day to make it legit enough to share in this post.
 
 ### Adding front-matter to Markdown
@@ -18,14 +18,9 @@ We need some manual labor to do before we get to the acrobatics.
 We can use YAML syntax at the beginning of a Markdown file to define the metadata. There's a library called `gray-matter` to parse it to JSON so we can use it in the next steps.
 
 ```md
----
 isbn: '0135957052'
 date_read: '2020-08-27'
 oneliner: A dead program normally does a lot less damage than a crippled one.
----
-
-## Chapter 1: A Pragmatic Philosophy
-...
 ```
 
 ```ts
@@ -50,7 +45,7 @@ const readMarkdownFile = (filePath: string) => {
 
 It's easy to retrieve a lot of information and generate specific meta images by using the ISBN. That is the only identifier we need for the rest. Amazon usually uses ISBN-10 as a path parameter for the product pages.
 
-![Amazon Product Page](/images/posts/enhancing-book-notes/amazon-isbn.png)
+![Amazon Product Page](/images/posts/book-metadata/amazon-isbn.png)
 
 ### Using Google Books API for metadata
 
@@ -101,7 +96,7 @@ const fetchBookMetadata = async (isbn: string): Promise<BookData> => {
 
 Now that we have the least relevant information to render a book page, we can take some time to prettify the meta tags. Here's how related services render the meta images related to book pages.
 
-![Amazon and Google Book's meta image](/images/posts/enhancing-book-notes/meta-amazon-google.png)
+![Amazon and Google Book's meta image](/images/posts/book-metadata/meta-amazon-google.png)
 
 Alright, that is doable with what we have.
 
@@ -185,4 +180,4 @@ Since it's a Next.js app, I prefer to save it to the filesystem. An alternative
 
 After injecting the meta images to the book pages, [metatags.io](https://metatags.io) is a great tool to verify how they look.
 
-![Our generated image](/images/posts/enhancing-book-notes/meta-screenshot.png)
+![Our generated image](/images/posts/book-metadata/meta-screenshot.png)

data/posts/lighthouse.md

@@ -10,15 +10,15 @@ In addition to eliminating the friction, Vercel also provides [analytics](https:
 
 And that's precisely what I did right after deploying a bearable version. But the results were not satisfying at all.
 
-![Lighthouse score before the optimization](/images/posts/happier-lighthouse/lighthouse-score-before.png)
+![Lighthouse score before the optimization](/images/posts/lighthouse/lighthouse-score-before.png)
 
 My minimal home page with three lines of text and a handful of links made Lighthouse complain sorely about the performance.
 
 The report is clear, it tells that I'm basically making your computer load and parse a bunch of irrelevant JavaScript.
 
-![Lighthouse score details, before the optimization](/images/posts/happier-lighthouse/lighthouse-score-before-detail.png)
+![Lighthouse score details, before the optimization](/images/posts/lighthouse/lighthouse-score-before-detail.png)
 
-> I thought that's an ethos to have if you are building a publishing thingy nowadays, or am I in the wrong [Medium?](/images/posts/happier-lighthouse/medium-110-requests.gif) 👹👹👹
+> I thought that's an ethos to have if you are building a publishing thingy nowadays, or am I in the wrong [Medium?](/images/posts/lighthouse/medium-110-requests.gif) 👹👹👹
 
 ### Finding out what I am excessively loading
 
@@ -33,11 +33,11 @@ I have two choices:
 
 Proceeding with the latter, I know one thing which doesn't get minified: **error messages!**
 
-![Digging up the excessively loaded code](/images/posts/happier-lighthouse/excessively-loaded-code.png)
+![Digging up the excessively loaded code](/images/posts/lighthouse/excessively-loaded-code.png)
 
 And searching for `only one of 'allowedTypes' and 'disallowedTypes' should be defined` in the `node_modules` is a good next step for approaching to the crux.
 
-![Search results for the error message.](/images/posts/happier-lighthouse/search-results-for-error-message.png)
+![Search results for the error message.](/images/posts/lighthouse/search-results-for-error-message.png)
 
 Then I realize it's seemingly related to markdown. Now that the scope is narrowed down, it's time to discover what I'm doing wrong.
 
@@ -123,7 +123,7 @@ export default Markdown
 
 In the end, the performance score of [the home page](/) increased dramatically.
 
-![Lighthouse score, after the optimization](/images/posts/happier-lighthouse/lighthouse-score-after.png)
+![Lighthouse score, after the optimization](/images/posts/lighthouse/lighthouse-score-after.png)
 
 This approach doesn't eradicate the CPU tax of loading and executing the JS on the pages that I need to render a code editor, such as this post.
 

data/posts/read.md

@@ -105,11 +105,11 @@ This approach works better. Still, sometimes I get side-tracked by the rabbit ho
 
 Here's an example from _User Friendly_, which I'm currently reading.
 
-![Sticky notes from User Friendly](/images/posts/how-do-I-read/how-do-I-read-post-it.jpg)
+![Sticky notes from User Friendly](/images/posts/read/post-it.jpg)
 
 Besides that, I started tagging the highlights based on their topic. It's helpful while taking action, which is a learning from another book: _How to Take Smart Notes_.
 
-![Tags](/images/posts/how-do-I-read/how-do-I-read-tags.jpg)
+![Tags](/images/posts/read/tags.jpg)
 
 #### Listen to what other readers say