Full Stack Personal Blog 13: AI Chat Design
Integrating AI models teaches you how to work with third-party APIs, handle natural language generation tasks, and optimize request/response management to enable intelligent conversation features.
Full Stack Personal Blog 12: Nested Comment Design
By designing a nested comment feature for posts using Prisma and GraphQL, you can learn how to handle recursive data structures, implement hierarchical comment relationships, and optimize queries for efficient data retrieval and updates.
Full Stack Personal Blog 11: Post Like Feature Design
By implementing the post like feature with Prisma and GraphQL, you can learn how to design efficient database models, handle simple relationships (such as the one-to-many relationship between posts and likes), and manage data queries and mutations in GraphQL.
Full Stack Personal Blog 10: CDN Storage
Choose AWS S3, 5GB storage, free for 12 months. The main reason is that Vercel hosts the project, and free users get 100GB of traffic per month. If you exceed this and don't pay, your account will be disabled, so you must add a CDN.
Full Stack Personal Blog 09: Authentication
Auth0 is an authentication and authorization platform. A free account supports up to 25,000 user logins. It supports one-click login with multiple social platforms, such as `Google`, `Github`, etc. You can also customize hooks to communicate with the host platform after successful login or registration.
Full Stack Personal Blog 08: Integrating GraphQL on the Frontend
`@apollo/client` is a library for interacting with GraphQL backends. It provides a simple API and powerful features, helping developers easily implement data queries, cache management, and state management in frontend frameworks like React.
Full Stack Personal Blog 07: Pothos Modularization and Prisma Integration
As your project grows and the GraphQL API becomes more complex, manually creating `schema` and `resolvers` can reduce development efficiency, as both must have the same structure. Otherwise, errors and unpredictable behavior may occur. When the `schema` and `resolvers` change, these two components can easily get out of sync. GraphQL schemas are defined as strings, so for SDL (Schema Definition Language), there is no code auto-completion or build-time error checking.
Full Stack Personal Blog 06: GraphQL API Design
GraphQL is a query language for APIs and a runtime for executing those queries. Unlike traditional REST APIs, GraphQL allows clients to request exactly the data they need—nothing more, nothing less—optimizing the data fetching process. All requests are handled through a single endpoint, and clients can combine multiple resource queries into a single request, eliminating the need for multiple HTTP calls. GraphQL's flexibility and efficiency make it ideal for dynamic data structures and complex applications, especially when efficient data transfer and cross-platform interaction are required.
Full Stack Personal Blog 05: Using Prisma to Operate the Database
Prisma is a modern database toolkit that provides a type-safe ORM (Object-Relational Mapping), making it easy for developers to interact with databases. With Prisma, you can automatically generate typed database queries, reducing the need to write raw SQL. It is an ideal choice for building efficient and scalable database applications.
Full Stack Personal Blog 04: Dark Mode
Shadcn/ui is a modern React UI component library designed to provide customizable, high-quality, dependency-free UI components. Leveraging the flexibility of Tailwind CSS and React, it offers a set of easy-to-use, responsive, and extensible UI components that help developers quickly build beautiful and feature-rich application interfaces, while maintaining design consistency and flexibility.