feat: add books page

content/en/patterns/_meta.tsx

@@ -11,6 +11,7 @@ export const Separator: FC<{ children: ReactNode }> = ({ children }) => {
 export default {
   'getting-started': '',
   'when-to-use-what': '',
+  'books': '',
   _: {
     title: <Separator>Categories</Separator>,
     type: 'separator',

content/en/patterns/books.mdx

@@ -0,0 +1,36 @@
+---
+description: "Recommended UX books for developers"
+icon: Book
+---
+
+# UX Books for Developers
+
+A curated list of books to help developers understand and implement better user experiences.
+
+## Essential Reads
+
+| Cover                                                                                | Title                                            | Author                      | Why Developers Should Read It                                                                                                       |
+| ------------------------------------------------------------------------------------ | ------------------------------------------------ | --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
+| ![Don't Make Me Think](https://covers.openlibrary.org/b/isbn/0321965515-M.jpg)       | Don't Make Me Think, Revisited                   | Steve Krug                  | • Practical usability principles<br/>• Developer-friendly approach<br/>• Real-world examples                                        |
+| ![Design of Everyday Things](https://covers.openlibrary.org/b/isbn/0465050654-M.jpg) | The Design of Everyday Things                    | Don Norman                  | • Fundamental design principles<br/>• Understanding user psychology<br/>• Error prevention                                          |
+| ![Practical UI](/books/practical-ui.jpg)                                             | [Practical UI](https://www.practical-ui.com/)    | Adham Dannaway              | • Logic-driven approach<br/>• Quick, actionable guidelines<br/>• Includes Figma design system<br/>• Updated in 2024                 |
+| ![Refactoring UI](/books/refactoring-ui.jpg)                                         | [Refactoring UI](https://www.refactoringui.com/) | Adam Wathan & Steve Schoger | • Design tactics for developers<br/>• Practical, visual examples<br/>• Component-based approach<br/>• Color & typography guidelines |
+
+## Form Design
+
+| Cover                                                      | Title                                                                                      | Author      | Why Developers Should Read It                                                                                     |
+| ---------------------------------------------------------- | ------------------------------------------------------------------------------------------ | ----------- | ----------------------------------------------------------------------------------------------------------------- |
+| ![Dos and Don'ts for Form Input](/books/do-dont-forms.jpg) | [Dos and Don'ts for Form Input and Selection](https://uxmovement.gumroad.com/l/dodontform) | UX Movement | • Comprehensive form patterns<br/>• Visual examples<br/>• Practical dos and don'ts<br/>• Regular updates included |
+
+## Tools & References
+
+| Cover                                                                          | Title                                                                                                                | Author          | Why Developers Should Read It                                                                                                                             |
+| ------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------- | --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| ![Smart Interface Design Patterns](/books/smart-interface-design-patterns.jpg) | [Smart Interface Design Patterns Checklist Cards](https://www.smashingmagazine.com/2020/08/checklist-cards-release/) | Vitaly Friedman | • 100 ready-to-use checklists<br/>• Covers all common UI components<br/>• Based on usability research<br/>• Perfect for design-implementation discussions |
+
+## Advanced UX
+
+| Cover                                                                 | Title                                                | Author           | Why Developers Should Read It                                                       |
+| --------------------------------------------------------------------- | ---------------------------------------------------- | ---------------- | ----------------------------------------------------------------------------------- |
+| ![About Face](https://covers.openlibrary.org/b/isbn/1118766571-M.jpg) | About Face: The Essentials of Interaction Design     | Alan Cooper      | • Interaction design patterns<br/>• User behavior models<br/>• Interface guidelines |
+| ![100 Things](https://covers.openlibrary.org/b/isbn/0321767535-M.jpg) | 100 Things Every Designer Needs to Know About People | Susan Weinschenk | • Psychology insights<br/>• Research-based decisions<br/>• Practical applications   |

next.config.ts

@@ -29,6 +29,10 @@ const nextConfig = withBundleAnalyzer(
           protocol: 'https',
           hostname: '**',
         },
+        {
+          protocol: 'https',
+          hostname: 'covers.openlibrary.org',
+        },
       ],
     },
     redirects: async () => [