diff --git a/apps/blog/content/blog/about-mcp-servers-and-how-we-built-one-for-prisma/index.mdx b/apps/blog/content/blog/about-mcp-servers-and-how-we-built-one-for-prisma/index.mdx
index 27d8e5d374..d50c37c6be 100644
--- a/apps/blog/content/blog/about-mcp-servers-and-how-we-built-one-for-prisma/index.mdx
+++ b/apps/blog/content/blog/about-mcp-servers-and-how-we-built-one-for-prisma/index.mdx
@@ -5,8 +5,11 @@ date: "2025-05-07"
authors:
- "Nikolas Burk"
metaTitle: "About MCP Servers & How We Built One for Prisma"
-metaImagePath: "/blog/about-mcp-servers-and-how-we-built-one-for-prisma/imgs/meta-c7ef9462464563ecc68ddf667e18dbef71f9f4fd-1266x711.png"
-heroImagePath: "/blog/about-mcp-servers-and-how-we-built-one-for-prisma/imgs/hero-af7a5b40501028b64219b2144f7b5c03723c4d99-844x474.svg"
+metaImagePath: "/about-mcp-servers-and-how-we-built-one-for-prisma/imgs/meta-c7ef9462464563ecc68ddf667e18dbef71f9f4fd-1266x711.png"
+heroImagePath: "/about-mcp-servers-and-how-we-built-one-for-prisma/imgs/hero-af7a5b40501028b64219b2144f7b5c03723c4d99-844x474.svg"
+tags:
+ - "education"
+ - "orm"
excerpt: |
Learn how MCP works by following the practical example of how we built the Prisma MCP server, including the tradeoffs between local and remote MCP servers, the `@modelcontextprotocol/sdk` package, and how we enabled LLMs to use the Prisma CLI.
@@ -42,7 +45,7 @@ In such scenarios, an LLM needs additional capabilities to interact with the "ou
LLM providers have responded to this need by implementing so-called _tool_ access. Individual providers use different names for it: OpenAI calls it [function calling](https://platform.openai.com/docs/guides/function-calling?api-mode=responses), Anthropic refers to it as [tool use](https://docs.anthropic.com/en/docs/build-with-claude/tool-use/overview), and others use terms like "plugins" or "actions."
-
+
This approach was messy because each LLM had a different interface for interacting with tools.
@@ -99,7 +102,7 @@ In November 2024, [Anthropic introduced the Model Context Protocol](https://www.
MCP provides a universal, open standard for connecting AI systems with external data sources. All LLMs that implement the MCP protocol can now access the same functionality if it's exposed through an MCP server.
-
+
Returning to the previous example: With MCP, you only need to implement the invoice search functionality _once_. You can then expose it via an MCP server to all LLMs that support the MCP protocol. Here's a pseudocode implementation:
@@ -124,7 +127,7 @@ await server.connect(transport);
```
Anthropic clearly struck a chord with this standard. If you were on X at the time, you probably saw multiple MCP posts a day. Google Trends for "MCP" tell the same story:
-
+
### How to connect an LLM to an MCP server
@@ -167,7 +170,7 @@ Before MCP, we would have had to implement support separately for each LLM. With
When introducing MCP, Anthropic released SDKs for various languages. The TypeScript SDK lives in the [`typescript-sdk`](https://github.com/modelcontextprotocol/typescript-sdk) repository and provides everything needed to implement MCP clients and servers.
-
+
### Local vs. remote MCP servers
@@ -175,7 +178,7 @@ When building an MCP server, you must decide if it runs _locally_ (on the same m
This depends on what the server does. If it needs access to the user's file system, it must run locally. If it just calls APIs, it can be local or remote (because an API can be called both from a local and remote machine).
-
+
In the case of Prisma, the LLM primarily needs access to the Prisma CLI in order to support developers with database-related workflows. The Prisma CLI may connect to a local or a remote database instance. However, because the CLI commands are executed locally, the Prisma MCP server also must be local.
@@ -305,7 +308,7 @@ Or check out our [docs](https://www.prisma.io/docs/postgres/integrations/mcp-ser
Once added, your AI tool will show the MCP server's status and available tools. Here's how it looks in Cursor:
-
+
## Beyond MCP: New capabilities for Prisma users in VS Code
diff --git a/apps/blog/content/blog/accelerate-ga-release-i9cqm6bsf2g6/index.mdx b/apps/blog/content/blog/accelerate-ga-release-i9cqm6bsf2g6/index.mdx
index c4dcdb8212..9903dbc153 100644
--- a/apps/blog/content/blog/accelerate-ga-release-i9cqm6bsf2g6/index.mdx
+++ b/apps/blog/content/blog/accelerate-ga-release-i9cqm6bsf2g6/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Sam Bhatti"
metaTitle: "Prisma Accelerate now in General Availability"
metaDescription: "Supercharge your applications with Prisma Accelerate's scalable connection pooling and global edge caching. Plus, enjoy our exclusive launch offer."
-metaImagePath: "/blog/accelerate-ga-release-i9cqm6bsf2g6/imgs/meta-42554fa75736c00b0ca55e1e440dde26f43dcb3f-1266x711.png"
-heroImagePath: "/blog/accelerate-ga-release-i9cqm6bsf2g6/imgs/hero-de83f5f843f2a86abd05659c94c3069e7577a0f5-844x474.svg"
+metaImagePath: "/accelerate-ga-release-i9cqm6bsf2g6/imgs/meta-42554fa75736c00b0ca55e1e440dde26f43dcb3f-1266x711.png"
+heroImagePath: "/accelerate-ga-release-i9cqm6bsf2g6/imgs/hero-de83f5f843f2a86abd05659c94c3069e7577a0f5-844x474.svg"
heroImageAlt: "Prisma Accelerate now in General Availability"
+tags:
+ - "announcement"
+ - "data-platform"
excerpt: |
Now in General Availability: Dive into [Prisma Accelerate](https://pris.ly/accelerate-blog), enhancing global database connections with connection pooling and edge caching for fast data access.
diff --git a/apps/blog/content/blog/accelerate-ipv6-first/index.mdx b/apps/blog/content/blog/accelerate-ipv6-first/index.mdx
index 2230b76538..22ae065d95 100644
--- a/apps/blog/content/blog/accelerate-ipv6-first/index.mdx
+++ b/apps/blog/content/blog/accelerate-ipv6-first/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Tyler Benfield"
metaTitle: "We Transitioned Prisma Accelerate to IPv6 Without Anyone Noticing"
metaDescription: "In July 2023, AWS announced the decision to begin charging for IPv4 addresses beginning in February 2024. This move had a major impact on Prisma Accelerate for reasons we’ll get into, prompting us to go all-in on IPv6. Join us for a deep dive into how we approached our IPv6 migration, lessons learned, and the outcome for users of Prisma Accelerate."
-metaImagePath: "/blog/accelerate-ipv6-first/imgs/meta-b5bac6d735ee17d003b0a06190a5fa5c0e3fcc15-1266x713.png"
-heroImagePath: "/blog/accelerate-ipv6-first/imgs/hero-248d5719caeee73ee2c7f94a7d194de949af1524-844x475.svg"
+metaImagePath: "/accelerate-ipv6-first/imgs/meta-b5bac6d735ee17d003b0a06190a5fa5c0e3fcc15-1266x713.png"
+heroImagePath: "/accelerate-ipv6-first/imgs/hero-248d5719caeee73ee2c7f94a7d194de949af1524-844x475.svg"
+tags:
+ - "data-platform"
excerpt: |
In July 2023, [AWS announced](https://aws.amazon.com/blogs/aws/new-aws-public-ipv4-address-charge-public-ip-insights/) the decision to begin charging for IPv4 addresses beginning in February 2024. This move had a major impact on [Prisma Accelerate](https://www.prisma.io/data-platform/accelerate) for reasons we’ll get into, prompting us to go all-in on IPv6. Join us for a deep dive into how we approached our IPv6 migration, lessons learned, and the outcome for users of Prisma Accelerate.
---
diff --git a/apps/blog/content/blog/accelerate-preview-release-ab229e69ed2/index.mdx b/apps/blog/content/blog/accelerate-preview-release-ab229e69ed2/index.mdx
index 1047594c41..c4a8d09768 100644
--- a/apps/blog/content/blog/accelerate-preview-release-ab229e69ed2/index.mdx
+++ b/apps/blog/content/blog/accelerate-preview-release-ab229e69ed2/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Ankur Datta"
metaTitle: "Accelerate in Preview: Global Database Cache & Scalable Connection Pool"
metaDescription: "Accelerate is going into Preview! Learn how to enable high-speed, scalable applications with a global cache and connection pooler."
-metaImagePath: "/blog/accelerate-preview-release-ab229e69ed2/imgs/meta-3a75c0ed5f8837980765d5b7589367216653d6b7-1266x711.png"
-heroImagePath: "/blog/accelerate-preview-release-ab229e69ed2/imgs/hero-587aeef34568af2258cd4e5f0453710b0b94259c-844x474.svg"
+metaImagePath: "/accelerate-preview-release-ab229e69ed2/imgs/meta-3a75c0ed5f8837980765d5b7589367216653d6b7-1266x711.png"
+heroImagePath: "/accelerate-preview-release-ab229e69ed2/imgs/hero-587aeef34568af2258cd4e5f0453710b0b94259c-844x474.svg"
heroImageAlt: "Accelerate in Preview"
+tags:
+ - "announcement"
+ - "data-platform"
excerpt: |
[Prisma Accelerate](https://www.prisma.io/data-platform/accelerate) is now available to everyone in Preview! Make your application faster with our powerful global cache and scalable connection pooler. [Get started now](https://pris.ly/pdp), and let us know what you think.
diff --git a/apps/blog/content/blog/accelerate-static-ip-support/index.mdx b/apps/blog/content/blog/accelerate-static-ip-support/index.mdx
index 88bcf7a10f..869c8dabe0 100644
--- a/apps/blog/content/blog/accelerate-static-ip-support/index.mdx
+++ b/apps/blog/content/blog/accelerate-static-ip-support/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Ankur Datta"
metaTitle: "Increase Database Security With Static IP Support in Prisma Accelerate"
metaDescription: "Prisma Accelerate now supports Static IPs, ensuring secure database connections with predictable IPs for controlled access."
-metaImagePath: "/blog/accelerate-static-ip-support/imgs/meta-9a5f27696242c051a689abed3d4b7099a8145301-1200x674.png"
-heroImagePath: "/blog/accelerate-static-ip-support/imgs/hero-06da453a2597f2571d34972ec912ad3c32f37ba6-844x474.svg"
+metaImagePath: "/accelerate-static-ip-support/imgs/meta-9a5f27696242c051a689abed3d4b7099a8145301-1200x674.png"
+heroImagePath: "/accelerate-static-ip-support/imgs/hero-06da453a2597f2571d34972ec912ad3c32f37ba6-844x474.svg"
heroImageAlt: "Enable Static IP in Prisma Accelerate"
+tags:
+ - "announcement"
+ - "data-platform"
excerpt: |
[Prisma Accelerate](https://www.prisma.io/data-platform/accelerate) introduces Static IP support, enabling secure connections to your database with predictable IPs for controlled access and minimized exposure. This allows connections from Accelerate to databases requiring trusted IP access.
---
@@ -29,21 +32,21 @@ By layering these defenses, you can better protect your database from various ty
To add one layer of these security measures, you can restrict database access from the public internet by configuring firewalls and IP allowlists to limit access to trusted IP addresses. It becomes possible if the IP addresses that require access to your database are static IP addresses.
-
+
A static IP address is an IPv4 or an IPv6 address that doesn’t change. Unlike dynamic IP addresses, which can change unpredictably, traffic from static IP addresses are easier to identify.
-
+
Using static IP addresses benefits managing and securing traffic by allowing you to configure your network firewalls or set up IP allowlisting to restrict access to your resources from specific IP addresses that don’t change.
Enabling static IP within your Prisma Accelerate configuration in a project environment allows using Accelerate with databases that have IP allowlisting enabled.
-
+
You can add the Accelerate static IP address in the database firewall IP allowlist or permit access to the IP address within your private network. This ensures that Accelerate can securely access your database while other unauthorized requests to your database are denied.
-
+
## Enable static IP in Prisma Accelerate
@@ -54,10 +57,10 @@ To enable static IP support for Accelerate within your existing or new project e
Users can opt-in to using static IP in the Platform Console in two ways:
1. When enabling Accelerate for your project environment, opt-in to static IP after specifying your database connection string and connection pool region.
- 
+ 
2. For projects already using Accelerate, enable static IP by navigating to Accelerate settings in your project environment.
- 
+ 
After you enable static IP within your Prisma Accelerate configuration, you’ll see a list of IPv4 and IPv6 addresses , which you will use to allow Accelerate traffic to your database.
diff --git a/apps/blog/content/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/index.mdx b/apps/blog/content/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/index.mdx
index e4ef5c271a..abbb4334cf 100644
--- a/apps/blog/content/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/index.mdx
+++ b/apps/blog/content/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/index.mdx
@@ -6,8 +6,11 @@ authors:
- "Nikolas Burk"
metaTitle: "Advanced Database Schema Management with Atlas & Prisma ORM"
metaDescription: "Atlas is a powerful data modeling and migrations tool enabling advanced DB schema management workflows, like CI/CD, schema monitoring, versioning, and more."
-metaImagePath: "/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/imgs/meta-862a4191726cfb1bcc2e53bc83e377e1af47cd5d-1200x675.png"
-heroImagePath: "/blog/advanced-database-schema-management-with-atlas-and-prisma-orm/imgs/hero-6ad0def91299fbf2a745f528d83a194350d0ee74-844x475.svg"
+metaImagePath: "/advanced-database-schema-management-with-atlas-and-prisma-orm/imgs/meta-862a4191726cfb1bcc2e53bc83e377e1af47cd5d-1200x675.png"
+heroImagePath: "/advanced-database-schema-management-with-atlas-and-prisma-orm/imgs/hero-6ad0def91299fbf2a745f528d83a194350d0ee74-844x475.svg"
+tags:
+ - "orm"
+ - "education"
excerpt: |
[Atlas](https://atlasgo.io/) is a powerful migration tool that enables advanced database schema management workflows, like CI/CD, schema monitoring, versioning, and more. Learn how to use Atlas together with Prisma ORM and make use of Atlas' capabilities by using low-level database features.
---
diff --git a/apps/blog/content/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/index.mdx b/apps/blog/content/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/index.mdx
index 9f67d07083..a0bc17152c 100644
--- a/apps/blog/content/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/index.mdx
+++ b/apps/blog/content/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/index.mdx
@@ -5,8 +5,8 @@ date: "2017-11-07"
authors:
- "Nikolas Burk"
metaTitle: "All you need to know about Apollo Client 2 | Prisma"
-metaImagePath: "/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/imgs/hero-ebd9548e6d9cfb33c4e35eac48e11a80532a8d30-1440x960.jpg"
-heroImagePath: "/blog/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/imgs/hero-ebd9548e6d9cfb33c4e35eac48e11a80532a8d30-1440x960.jpg"
+metaImagePath: "/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/imgs/hero-ebd9548e6d9cfb33c4e35eac48e11a80532a8d30-1440x960.jpg"
+heroImagePath: "/all-you-need-to-know-about-apollo-client-2-7e27e36d62fd/imgs/hero-ebd9548e6d9cfb33c4e35eac48e11a80532a8d30-1440x960.jpg"
heroImageAlt: "All you need to know about Apollo Client 2"
excerpt: |
Apollo Client, a powerful and flexible GraphQL client library, just reached version 2.0. In this post, we want to
diff --git a/apps/blog/content/blog/ambassador-program-nxkwgcgnuvfx/index.mdx b/apps/blog/content/blog/ambassador-program-nxkwgcgnuvfx/index.mdx
index a33c4deb5a..d2e983f436 100644
--- a/apps/blog/content/blog/ambassador-program-nxkwgcgnuvfx/index.mdx
+++ b/apps/blog/content/blog/ambassador-program-nxkwgcgnuvfx/index.mdx
@@ -7,9 +7,11 @@ authors:
- "Nikolas Burk"
metaTitle: "Announcing the Prisma Ambassador Program — Building A Community of Experts"
metaDescription: "We are thrilled to announce the launch of the Ambassador Program to empower the Prisma community, while also helping individual contributors build their own brand."
-metaImagePath: "/blog/ambassador-program-nxkwgcgnuvfx/imgs/meta-de28b5e0df55c52078065ee2ae0b44d6cdf0da1e-1692x852.png"
-heroImagePath: "/blog/ambassador-program-nxkwgcgnuvfx/imgs/hero-1bdf6237d95ded8d448f28db203012147fdcd39e-846x426.png"
+metaImagePath: "/ambassador-program-nxkwgcgnuvfx/imgs/meta-de28b5e0df55c52078065ee2ae0b44d6cdf0da1e-1692x852.png"
+heroImagePath: "/ambassador-program-nxkwgcgnuvfx/imgs/hero-1bdf6237d95ded8d448f28db203012147fdcd39e-846x426.png"
heroImageAlt: "Prisma Ambassador Program — Building A Community of Experts"
+tags:
+ - "announcement"
excerpt: |
We are thrilled to announce the [Prisma Ambassador Program](https://www.prisma.io/ambassador) to empower the Prisma community, while also helping individual contributors build their own brand.
diff --git a/apps/blog/content/blog/amplication-customer-story-nmlkbnlllxnn/index.mdx b/apps/blog/content/blog/amplication-customer-story-nmlkbnlllxnn/index.mdx
index 0f195dbb66..82559cd9eb 100644
--- a/apps/blog/content/blog/amplication-customer-story-nmlkbnlllxnn/index.mdx
+++ b/apps/blog/content/blog/amplication-customer-story-nmlkbnlllxnn/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Alex Emerich"
metaTitle: "How Prisma helps Amplication evolutionize backend development"
metaDescription: "How Prisma helps Amplication evolutionize backend development"
-metaImagePath: "/blog/amplication-customer-story-nmlkbnlllxnn/imgs/meta-4baa84e48a0da8e13e23367137d5a17515119aaf-2881x1620.png"
-heroImagePath: "/blog/amplication-customer-story-nmlkbnlllxnn/imgs/hero-b1fb9ec0c8fca054011688621bfe51ea1836af10-844x474.svg"
+metaImagePath: "/amplication-customer-story-nmlkbnlllxnn/imgs/meta-4baa84e48a0da8e13e23367137d5a17515119aaf-2881x1620.png"
+heroImagePath: "/amplication-customer-story-nmlkbnlllxnn/imgs/hero-b1fb9ec0c8fca054011688621bfe51ea1836af10-844x474.svg"
heroImageAlt: "How Prisma helps Amplication evolutionize backend development"
+tags:
+ - "usersuccessstory"
excerpt: |
[Amplication](https://amplication.com/) is an open-source development tool. It helps you develop quality Node.js applications without spending time on repetitive coding tasks. It’s perfect for both backend and fullstack developers.
@@ -27,7 +29,7 @@ Working at larger companies, [Amplication](https://amplication.com/) founder, Yu
With Amplication, you can easily create data models and configure role-based access control with a simple and intuitive UI (or even [via their CLI](https://github.com/amplication/amplication/tree/master/packages/amplication-cli#amp-entitiescreate-displayname)). Based on these model definitions, Amplication generates production-ready, yet fully customizable, application code. This code is continuously pushed to your GitHub repository, and you get a dedicated Docker container to house your database, a Node.js application, and a React client.
-
+
For fullstack developers, their repetitive coding tasks are taken care of, but they still retain **complete ownership** of the code to deploy where they wish and are free to download the generated app code and continue development elsewhere.
@@ -48,7 +50,7 @@ For the server side you get:
- [Jest](https://jestjs.io/): A delightful JavaScript testing framework with a focus on simplicity
- [Docker](https://www.docker.com/): An open platform for developing, shipping, and running applications
-
+
The Amplication team strongly believes in open-source technology and a user focused community, so they made sure this belief was at the center of the tools they bring their users.
diff --git a/apps/blog/content/blog/announcing-accelerate-usrvpi6sfkv4/index.mdx b/apps/blog/content/blog/announcing-accelerate-usrvpi6sfkv4/index.mdx
index 782b0fb527..db51c062e6 100644
--- a/apps/blog/content/blog/announcing-accelerate-usrvpi6sfkv4/index.mdx
+++ b/apps/blog/content/blog/announcing-accelerate-usrvpi6sfkv4/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Andrew Carlson"
metaTitle: "Prisma | Introducing Accelerate in Early Access"
metaDescription: "Query up to 1000x faster on any Prisma-supported database with our new distributed cache and scalable connection pool for Serverless apps."
-metaImagePath: "/blog/announcing-accelerate-usrvpi6sfkv4/imgs/meta-25afee16878423e24c7aff2bb3fe49a433996d03-1200x631.png"
-heroImagePath: "/blog/announcing-accelerate-usrvpi6sfkv4/imgs/hero-9c6258461d73719cebc60136dd4e976d79306dcb-845x475.svg"
+metaImagePath: "/announcing-accelerate-usrvpi6sfkv4/imgs/meta-25afee16878423e24c7aff2bb3fe49a433996d03-1200x631.png"
+heroImagePath: "/announcing-accelerate-usrvpi6sfkv4/imgs/hero-9c6258461d73719cebc60136dd4e976d79306dcb-845x475.svg"
heroImageAlt: "Introducing Accelerate in Early Access"
+tags:
+ - "announcement"
+ - "data-platform"
excerpt: |
Query up to 1000x faster on any Prisma-supported database with our distributed cache and scalable connection pool for Serverless apps.
diff --git a/apps/blog/content/blog/announcing-discord-1liaops7lxv9/index.mdx b/apps/blog/content/blog/announcing-discord-1liaops7lxv9/index.mdx
index 6fb8ab01cf..fb76f75c78 100644
--- a/apps/blog/content/blog/announcing-discord-1liaops7lxv9/index.mdx
+++ b/apps/blog/content/blog/announcing-discord-1liaops7lxv9/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Jon Harrell"
metaTitle: "Building on an Established Community: Prisma Now on Discord"
metaDescription: "Prisma is excited to expand the established Prisma Community Discord and further collaborate with the Prisma community."
-metaImagePath: "/blog/announcing-discord-1liaops7lxv9/imgs/meta-388b596e6a40f7eeaf42604a4645c93dd051af6a-1267x712.png"
-heroImagePath: "/blog/announcing-discord-1liaops7lxv9/imgs/hero-7ae00282956a1f6a68f815b4cffee5ee1b1ce934-844x474.svg"
+metaImagePath: "/announcing-discord-1liaops7lxv9/imgs/meta-388b596e6a40f7eeaf42604a4645c93dd051af6a-1267x712.png"
+heroImagePath: "/announcing-discord-1liaops7lxv9/imgs/hero-7ae00282956a1f6a68f815b4cffee5ee1b1ce934-844x474.svg"
heroImageAlt: "Prisma Now on Discord"
+tags:
+ - "announcement"
excerpt: |
We are more than excited to join [Discord](https://discord.gg/KQyTW2H5ca)! Read to learn more about how we're approaching our Discord community, what to expect from it and how you can join.
@@ -44,7 +46,7 @@ From code repositories to social media feeds, Discord's integration capabilities
With features like Stage Channels, we can host live events, AMAs, webinars, and more, encouraging real-time interaction between our team and the community.
-
+
We're incredibly excited to embark on this new chapter on Discord and look forward to enhancing the sense of camaraderie and collaboration that the Prisma community is known for. So whether you're an old member or a newcomer, we welcome you to join us on this exciting journey!
diff --git a/apps/blog/content/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/index.mdx b/apps/blog/content/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/index.mdx
index 2540adbcf6..071038e4d3 100644
--- a/apps/blog/content/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/index.mdx
+++ b/apps/blog/content/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Ankur Datta"
metaTitle: "On-Demand Cache Invalidation Now Available in Prisma Accelerate"
metaDescription: "Boost app performance with precise control using Prisma's on-demand cache invalidation."
-metaImagePath: "/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/imgs/meta-40c9facc0c25985278c069ade326008e14baef9a-1266x711.png"
-heroImagePath: "/blog/announcing-on-demand-cache-invalidation-for-prisma-accelerate/imgs/hero-4100fa47bccf0620564331dda7e0c65bcd069ef2-844x474.svg"
+metaImagePath: "/announcing-on-demand-cache-invalidation-for-prisma-accelerate/imgs/meta-40c9facc0c25985278c069ade326008e14baef9a-1266x711.png"
+heroImagePath: "/announcing-on-demand-cache-invalidation-for-prisma-accelerate/imgs/hero-4100fa47bccf0620564331dda7e0c65bcd069ef2-844x474.svg"
heroImageAlt: "Prisma Accelerate's cache invalidation API in a code block"
+tags:
+ - "data-platform"
+ - "newrelease-feature"
excerpt: |
Caching with Prisma Accelerate can significantly boost performance for read-heavy applications while reducing strain on your database. On-demand cache invalidation gives you precise control over refreshes, simplifying management and optimization while ensuring that up-to-date information is always served.
---
@@ -18,7 +21,7 @@ excerpt: |
Caching stores frequently accessed data in a temporary layer for quicker access, minimizing the need for repeated fetching from the original source. Prisma Accelerate caches data in the location closest to your server to provide faster data retrieval.
> Explore our [speed test](https://accelerate-speed-test.prisma.io/) to experience firsthand how caching can dramatically improve your application's performance.
-> 
+> 
>
**Benefits of caching:**
diff --git a/apps/blog/content/blog/announcing-prisma-2-n0v98rzc8br1/index.mdx b/apps/blog/content/blog/announcing-prisma-2-n0v98rzc8br1/index.mdx
index 2d3693ac64..13d36c247f 100644
--- a/apps/blog/content/blog/announcing-prisma-2-n0v98rzc8br1/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-2-n0v98rzc8br1/index.mdx
@@ -5,8 +5,8 @@ date: "2020-06-09"
authors:
- "Nikolas Burk"
metaTitle: "Announcing Prisma 2: Confidence and productivity for your database"
-metaImagePath: "/blog/announcing-prisma-2-n0v98rzc8br1/imgs/hero-11436ec45c7ccbc812212d1d6d7c8794d9514f2f-1692x852.jpg"
-heroImagePath: "/blog/announcing-prisma-2-n0v98rzc8br1/imgs/hero-11436ec45c7ccbc812212d1d6d7c8794d9514f2f-1692x852.jpg"
+metaImagePath: "/announcing-prisma-2-n0v98rzc8br1/imgs/hero-11436ec45c7ccbc812212d1d6d7c8794d9514f2f-1692x852.jpg"
+heroImagePath: "/announcing-prisma-2-n0v98rzc8br1/imgs/hero-11436ec45c7ccbc812212d1d6d7c8794d9514f2f-1692x852.jpg"
heroImageAlt: " Ombre Prisma"
excerpt: |
Accessing databases in Node.js and TypeScript can feel brittle and painful. Prisma removes the pain with an auto-generated and type-safe query builder that's tailored to your data! [Try it out!](https://www.prisma.io/docs/getting-started/quickstart)
@@ -74,7 +74,7 @@ As an example, assume you have these `User` and `Post` tables:
-
+
```sql
CREATE TABLE "User" (
@@ -378,7 +378,7 @@ it now takes half a day to implement something that used to take two or three.
Server-side applications typically expose an _API_ that's consumed by frontend (e.g. web or mobile) or other apps. Prisma Client is compatible with all existing API technologies, such as REST, GraphQL, Thrift, or gRPC.
-
+
### Prisma works with various deployment models
diff --git a/apps/blog/content/blog/announcing-prisma-2-zq1s745db8i5/index.mdx b/apps/blog/content/blog/announcing-prisma-2-zq1s745db8i5/index.mdx
index 405a445b5e..40d0b82994 100644
--- a/apps/blog/content/blog/announcing-prisma-2-zq1s745db8i5/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-2-zq1s745db8i5/index.mdx
@@ -5,8 +5,8 @@ date: "2019-06-18"
authors:
- "Nikolas Burk"
metaTitle: "Type-safe Database Access & Declarative Migrations | Prisma 2 Preview"
-metaImagePath: "/blog/announcing-prisma-2-zq1s745db8i5/imgs/hero-34a26858c7de3cad0d84a376d12b58b82ee10da0-1200x630.png"
-heroImagePath: "/blog/announcing-prisma-2-zq1s745db8i5/imgs/hero-34a26858c7de3cad0d84a376d12b58b82ee10da0-1200x630.png"
+metaImagePath: "/announcing-prisma-2-zq1s745db8i5/imgs/hero-34a26858c7de3cad0d84a376d12b58b82ee10da0-1200x630.png"
+heroImagePath: "/announcing-prisma-2-zq1s745db8i5/imgs/hero-34a26858c7de3cad0d84a376d12b58b82ee10da0-1200x630.png"
heroImageAlt: "Prisma 2 Preview: Type-safe Database Access & Declarative Migrations"
excerpt: |
@@ -49,7 +49,7 @@ In recent years, many areas of application development have been modernized to f
But what about the **database workflows** developers are dealing with every day? What's the next-generation tooling for **accessing databases** from within an application or for performing **schema migrations**?
-
+
For database access, developers can use traditional ORMs (e.g. [Sequelize](http://docs.sequelizejs.com) for Node.js or [GORM](https://github.com/jinzhu/gorm) for Go). While often beneficial to get a project off the ground, these aren't a good longterm fit as project complexity quickly outgrows the capabilities of traditional ORMs.
@@ -68,7 +68,7 @@ Let's take a look at Photon and Lift in more detail.
### Photon – A type-safe database client to replace traditional ORMs
-
+
Photon is a type-safe database client that's auto-generated based on the Prisma data model (which is a representation of your database schema). It provides a powerful and lightweight layer of mapping code you can use to talk to a database in your application.
@@ -76,7 +76,7 @@ It has a modern and ergonomic data access API that's tailored to the needs of ap
### Lift – Declarative data modeling & migrations
-
+
Lift is based on Prisma's declarative [data model definition](https://github.com/prisma/prisma2/blob/master/docs/data-modeling.md) which codifies your database schema(s). To migrate your database, you adjust the data model and "apply" the changes using the Lift CLI.
@@ -423,7 +423,7 @@ The Prisma server that was required as a database proxy in Prisma 1 is now optio
This is due to a fundamental architecture change: the query and migration engines that previously ran inside the Prisma server can now run as plain binaries alongside your application on the same host.
-
+
### The Prisma core is rewritten in Rust
diff --git a/apps/blog/content/blog/announcing-prisma-6-18-0/index.mdx b/apps/blog/content/blog/announcing-prisma-6-18-0/index.mdx
index a30c1452d3..f318eec6df 100644
--- a/apps/blog/content/blog/announcing-prisma-6-18-0/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-6-18-0/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Mike Hartington"
metaTitle: "Prisma ORM 6.18.0, Postgres Database Metrics and Config Modernization"
metaDescription: "Catch up on the lates 6.18.0 release for Prisma ORM and Prisma Postgres."
-metaImagePath: "/blog/announcing-prisma-6-18-0/imgs/meta-85fc09231b7180336b63d1da7fe47a2520db99f5-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-6-18-0/imgs/hero-6903d477604982ce17726b525221e1e1de6eb1a1-844x474.svg"
+metaImagePath: "/announcing-prisma-6-18-0/imgs/meta-85fc09231b7180336b63d1da7fe47a2520db99f5-1266x711.png"
+heroImagePath: "/announcing-prisma-6-18-0/imgs/hero-6903d477604982ce17726b525221e1e1de6eb1a1-844x474.svg"
heroImageAlt: "Prisma 6.18.0 Release "
+tags:
+ - "newrelease-feature"
+ - "orm"
excerpt: |
We just released Prisma [6.18.0](https://github.com/prisma/prisma/releases/tag/6.18.0) with several bug fixes and improvments. Additionally, we added more support for the Prisma Config file to prepare for the next major release of Prisma ORM.
---
@@ -17,7 +20,7 @@ excerpt: |
Last release, we included a new workspace metrics overview, so folks can get a quick glance on their usage data across your entire workspace. Now, we’ve added more insights into your database usage with database metrics.
-
+
Here, you can view the usage of an individual database, with stats on:
diff --git a/apps/blog/content/blog/announcing-prisma-6-19-0/index.mdx b/apps/blog/content/blog/announcing-prisma-6-19-0/index.mdx
index 6e819e882b..3e87e071e8 100644
--- a/apps/blog/content/blog/announcing-prisma-6-19-0/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-6-19-0/index.mdx
@@ -6,8 +6,12 @@ authors:
- "Mike Hartington"
metaTitle: "Announcing Prisma 6.19.0"
metaDescription: "Prisma 6.19 release includes pooled Postgres connections and VS Code extension improvements"
-metaImagePath: "/blog/announcing-prisma-6-19-0/imgs/meta-fab568a4879cfeb58a8405888c303ce5b6b279fb-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-6-19-0/imgs/hero-21b965afb8b247bc0f088a71d844d66b64d5da38-844x474.svg"
+metaImagePath: "/announcing-prisma-6-19-0/imgs/meta-fab568a4879cfeb58a8405888c303ce5b6b279fb-1266x711.png"
+heroImagePath: "/announcing-prisma-6-19-0/imgs/hero-21b965afb8b247bc0f088a71d844d66b64d5da38-844x474.svg"
+tags:
+ - "prisma-postgres"
+ - "orm"
+ - "newrelease-feature"
excerpt: |
We just released Prisma 6.19.0 ORM, which includes several bug fixes and improvements. We’ve also included a bunch of improvements to managing your Prisma Postgres Connection, connection pooling, and local Prisma Postgres within VS Code.
---
@@ -24,7 +28,7 @@ If you’re not using the Prisma extension for VS Code, Cursor, or Windsurf, you
Now, we’ve updated the extension to support local Prisma Postgres without having to login. This has been a [frequently requested feature](https://github.com/prisma/language-tools/pull/1914), so we’re happy to get this done. We’ve also cleaned up the UI a bit to have a clearer separation between what is your local databases, and what is your remote databases.
-
+
## Preparing for the future
diff --git a/apps/blog/content/blog/announcing-prisma-day-50cg22nn40qk/index.mdx b/apps/blog/content/blog/announcing-prisma-day-50cg22nn40qk/index.mdx
index a334cd386f..0515b5d232 100644
--- a/apps/blog/content/blog/announcing-prisma-day-50cg22nn40qk/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-day-50cg22nn40qk/index.mdx
@@ -5,8 +5,8 @@ date: "2019-04-11"
authors:
- "Etel Sverdlov"
metaTitle: "Prisma Day 2019 - community conference on modern app development"
-metaImagePath: "/blog/announcing-prisma-day-50cg22nn40qk/imgs/meta-eeacc461f1965ed958af330fc9dc93f635920b43-1200x630.png"
-heroImagePath: "/blog/announcing-prisma-day-50cg22nn40qk/imgs/hero-d719c9276cc4c57665d4a32cc5fdae5b5bfcad50-1200x630.png"
+metaImagePath: "/announcing-prisma-day-50cg22nn40qk/imgs/meta-eeacc461f1965ed958af330fc9dc93f635920b43-1200x630.png"
+heroImagePath: "/announcing-prisma-day-50cg22nn40qk/imgs/hero-d719c9276cc4c57665d4a32cc5fdae5b5bfcad50-1200x630.png"
heroImageAlt: "Announcing Prisma Day the future of data"
excerpt: |
Announcing the first [Prisma Day](https://www.prisma.io/day), a one-day Prisma community conference on the
diff --git a/apps/blog/content/blog/announcing-prisma-orm-7-0-0/index.mdx b/apps/blog/content/blog/announcing-prisma-orm-7-0-0/index.mdx
index 9330c56e84..6e3932a7c3 100644
--- a/apps/blog/content/blog/announcing-prisma-orm-7-0-0/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-orm-7-0-0/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Mike Hartington"
metaTitle: "Prisma 7 Release: Rust-Free, Faster, and More Compatible"
metaDescription: "Prisma ORM 7 delivers major performance gains, a Rust-free client, and a streamlined developer experience, plus deeper Prisma Postgres integration."
-metaImagePath: "/blog/announcing-prisma-orm-7-0-0/imgs/meta-6b30aeef18d38ef00eb7b90286801660d84a9a0e-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-orm-7-0-0/imgs/hero-bbef45a84ff4bd03130bed3589b7d240c29ce325-844x474.svg"
+metaImagePath: "/announcing-prisma-orm-7-0-0/imgs/meta-6b30aeef18d38ef00eb7b90286801660d84a9a0e-1266x711.png"
+heroImagePath: "/announcing-prisma-orm-7-0-0/imgs/hero-bbef45a84ff4bd03130bed3589b7d240c29ce325-844x474.svg"
+tags:
+ - "announcement"
excerpt: |
Today, we’re thrilled to announce the latest release of Prisma ORM and Prisma Postgres. Over the past year we focused on making it simpler and faster to build applications with Prisma, no matter what tools you use or where you deploy, with exceptional developer experience at the core.
---
diff --git a/apps/blog/content/blog/announcing-prisma-orm-7-2-0/index.mdx b/apps/blog/content/blog/announcing-prisma-orm-7-2-0/index.mdx
index 8368b9894b..461ad21d10 100644
--- a/apps/blog/content/blog/announcing-prisma-orm-7-2-0/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-orm-7-2-0/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Mike Hartington"
metaTitle: "Prisma ORM 7.2.0 Released: CLI Improvements, Bug Fixes & Better Configs"
metaDescription: "Prisma ORM 7.2.0 is out with key improvements: the return of the --url flag, smarter prisma init configs for Node and Bun, better CLI errors, and fixes for @db.Money. Upgrade today."
-metaImagePath: "/blog/announcing-prisma-orm-7-2-0/imgs/meta-e05db51030f5b58e706489c501174d1d00eb99ec-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-orm-7-2-0/imgs/hero-51b054f6d21361fc56212a05c7efd36b78e62ff3-844x474.svg"
+metaImagePath: "/announcing-prisma-orm-7-2-0/imgs/meta-e05db51030f5b58e706489c501174d1d00eb99ec-1266x711.png"
+heroImagePath: "/announcing-prisma-orm-7-2-0/imgs/hero-51b054f6d21361fc56212a05c7efd36b78e62ff3-844x474.svg"
+tags:
+ - "orm"
excerpt: |
We just released Prisma ORM 7.2.0, which includes several bug fixes and improvements. We’ve also been reviewing community feedback on Prisma 7 and making adjustments to better support your needs.
diff --git a/apps/blog/content/blog/announcing-prisma-playground-xeywknkj0e1p/index.mdx b/apps/blog/content/blog/announcing-prisma-playground-xeywknkj0e1p/index.mdx
index ed5aa9f8ce..e09f709a4a 100644
--- a/apps/blog/content/blog/announcing-prisma-playground-xeywknkj0e1p/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-playground-xeywknkj0e1p/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Nikolas Burk"
metaTitle: "Prisma Playground: An Interactive Learning Experience for Prisma"
metaDescription: "Explore the Prisma Client API to send database queries and Prisma Migrate worklfows to evolve your database schema in an interactive environment."
-metaImagePath: "/blog/announcing-prisma-playground-xeywknkj0e1p/imgs/meta-470fec1fa04cf5fccadfadd70b449d857ee62116-1688x948.png"
-heroImagePath: "/blog/announcing-prisma-playground-xeywknkj0e1p/imgs/hero-1735a3ccb59d21fc0d32410b0b3ac83242fcd020-844x474.svg"
+metaImagePath: "/announcing-prisma-playground-xeywknkj0e1p/imgs/meta-470fec1fa04cf5fccadfadd70b449d857ee62116-1688x948.png"
+heroImagePath: "/announcing-prisma-playground-xeywknkj0e1p/imgs/hero-1735a3ccb59d21fc0d32410b0b3ac83242fcd020-844x474.svg"
heroImageAlt: "Prisma Playground: An Interactive Learning Experience for Prisma"
+tags:
+ - "announcement"
excerpt: |
We are excited to announce [Prisma Playground](https://playground.prisma.io/), an interactive learning experience for the Prisma ORM. The Playground lets you explore Prisma Client queries and learn Prisma Migrate workflows in an isolated sandbox environment.
@@ -41,7 +43,7 @@ If you're not yet using Prisma, be sure to visit the Playground to explore the P
When getting started with the Prisma Playgroud, you can choose whether you want to learn about Prisma Client or Prisma Migrate.
-
+
Depending on what you choose, you'll end up in the interactive editor to send queries with Prisma Client or follow interactive guides that teach you Prisma Migrate workflows.
@@ -55,13 +57,13 @@ While the explorer has a bunch of preconfigured queries, you're totally free to
For convenience, the Prisma Client API explorer comes with initial sample data and a fixed schema that you can view by hitting the **`prisma/schema.prisma`** tab next to the **Run** button.
-
+
### Learn Prisma Migrate workflows
For Prisma Migrate, the Playground offers interactive guides that give instructions for you to learn about the various migration workflows Prisma Migrate supports, such as [creating a table](https://playground.prisma.io/guides/migrations_tables_create?step=0), [renaming a column](https://playground.prisma.io/guides/migrations_column_rename?step=0) or [defining a many-to-many relationship](https://playground.prisma.io/guides/relations_many-to-many-implicit?step=0).
-
+
## Let us know what you think
diff --git a/apps/blog/content/blog/announcing-prisma-postgres-early-access/index.mdx b/apps/blog/content/blog/announcing-prisma-postgres-early-access/index.mdx
index 13ffbe5d19..0a13f7fa68 100644
--- a/apps/blog/content/blog/announcing-prisma-postgres-early-access/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-postgres-early-access/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Nikolas Burk"
metaTitle: "Prisma Postgres®: Building a Modern PostgreSQL Service Using Unikernels & MicroVMs"
metaDescription: "At Prisma, we believe that deploying a database should be as simple as adding a new page in Notion. Today, we are excited to share the first milestone towards this vision: Prisma Postgres® gives developers an always-on database with pay-as-you-go pricing, thanks to our unique architecture design."
-metaImagePath: "/blog/announcing-prisma-postgres-early-access/imgs/meta-6796d74a842eae9429254e7ed11b483985ba4e50-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-postgres-early-access/imgs/hero-153cb5a3d4a5447955824c28ae43788e7c407adf-633x356.png"
+metaImagePath: "/announcing-prisma-postgres-early-access/imgs/meta-6796d74a842eae9429254e7ed11b483985ba4e50-1266x711.png"
+heroImagePath: "/announcing-prisma-postgres-early-access/imgs/hero-153cb5a3d4a5447955824c28ae43788e7c407adf-633x356.png"
+tags:
+ - "announcement"
excerpt: |
At Prisma, we believe that deploying a database should be as simple as adding a new page in Notion. Today, we are excited to share the first milestone towards this vision: Prisma Postgres® gives developers an _always-on_ database with _pay-as-you-go_ pricing — thanks to our unique architecture design. [Try it now!](https://www.prisma.io/docs/getting-started/quickstart-prismaPostgres)
---
@@ -42,7 +44,7 @@ When using serverless databases, developers don't need to think about provisioni
The promise of auto-scaling often means that a database can scale down to zero, i.e., it's _suspended_. This can lead to high query latencies and poor user experience when the database needs to be "woken up" after inactivity, for example:
-
+
*Source: [Vercel Docs | Vercel Postgres Limits](https://vercel.com/docs/storage/vercel-postgres/limits#vercel-postgres-cold-starts)*
@@ -62,7 +64,7 @@ This difficulty has led companies like [PlanetScale](https://planetscale.com/blo
What if you could get all the benefits of "serverless" without the drawbacks, like limited free tiers and cold starts? We are making this vision a reality by building a managed PostgreSQL service from the ground up.
-
+
Today, we are thrilled to share the first step in this direction: We've teamed up with [Unikraft](https://unikraft.cloud/) to provision PostgreSQL instances using [Unikraft Cloud](https://unikraft.cloud/docs/), a groundbreaking millisecond cloud platform that eliminates cold starts, enables millisecond scale-to-zero and auto-scale, and allows for thousands of instances to run on a single bare metal machine.
@@ -93,7 +95,7 @@ Prisma Postgres is neither. Instead, it uses Unikraft Cloud and is based on a ne
Let's take a closer look at Unikraft Cloud's millisecond cloud infrastructure:
-
+
To provide high efficiency and millisecond semantics, the Unikraft team had to optimize network components, cloud stack and application start time. Here's a quick overview of Unikraft Cloud's [core components](https://unikraft.cloud/how-it-works/) from the diagram above:
@@ -141,7 +143,7 @@ Unikraft Cloud, which uses unikernels as one of its core components, provides th
Through an extra compilation step, Unikraft turns a traditional fullstack application container into a unikernel binary image that includes only the resources needed to run it — think: a _specialized operating system tailored to the needs of each particular application_:
-
+
*Source: [Unikraft Cloud - How it works](https://unikraft.cloud/how-it-works)*
@@ -149,13 +151,13 @@ Through an extra compilation step, Unikraft turns a traditional fullstack applic
We've created the Prisma Postgres unikernel binary image in close collaboration with the Unikraft team. Here's the diagram of the Unikraft compilation process from before — but specialized for Prisma Postgres:
-
+
The Unikraft team managed to trim the original PostgreSQL image down from 280MB to 61MB. Here's a breakdown of the components of the **Prisma Postgres image**:
-
+
We reduced the image to about 20% of its original size by identifying and removing unnecessary packages from our deployment. The original PostgreSQL image includes a lot of generic functionality that isn't needed for Prisma Postgres.
@@ -163,7 +165,7 @@ In our architecture, these specialized binary images are deployed as unikernels
Thanks to unikraft, a single machine can host thousands of application (in our case: Prisma Postgres) instances:
-
+
### Comparing standard virtual machines, containers & unikernels
@@ -176,14 +178,14 @@ Unikernels take a first-principles approach to cloud deployment. In the cloud, a
Everything in between the two is overhead. A unikernel adds the thinnest possible layer of software between the two such that the application can run on the hypervisor with the highest efficiency:
-
+
*Source: [Unikraft Docs - Virtualization](https://unikraft.org/docs/concepts/virtualization)*
Here's a summary of the advantages unikernels have in comparison to standard VMs and containers:
-
+
Unikraft's mission is to "enable developers to create a specialized OS for every single application to ensure the best performance, security guarantees, and desired KPIs."
@@ -205,7 +207,7 @@ Prisma Postgres is a major step towards our vision of providing a fully integrat
Our suite of Prisma products ensures you can [build, fortify, and grow](https://www.prisma.io/blog/bfg) data-driven applications without worrying about data modeling, migrations, querying, or complex and expensive infrastructure (like Redis or Apache Kafka):
-
+
Here's an overview of what you get with Prisma:
diff --git a/apps/blog/content/blog/announcing-prisma-postgres-for-ai-coding-agents/index.mdx b/apps/blog/content/blog/announcing-prisma-postgres-for-ai-coding-agents/index.mdx
index e5ba41f744..71a382affd 100644
--- a/apps/blog/content/blog/announcing-prisma-postgres-for-ai-coding-agents/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-postgres-for-ai-coding-agents/index.mdx
@@ -5,8 +5,10 @@ date: "2025-02-06"
authors:
- "Søren Bramer Schmidt"
metaTitle: "Announcing: Instant Prisma Postgres for AI Coding Agents"
-metaImagePath: "/blog/announcing-prisma-postgres-for-ai-coding-agents/imgs/meta-24be732ef3e8f019820d370b8a5f74ab14170fdc-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-postgres-for-ai-coding-agents/imgs/hero-6ad1b7b4a851a45e91418d443573f0c38accc78d-844x474.svg"
+metaImagePath: "/announcing-prisma-postgres-for-ai-coding-agents/imgs/meta-24be732ef3e8f019820d370b8a5f74ab14170fdc-1266x711.png"
+heroImagePath: "/announcing-prisma-postgres-for-ai-coding-agents/imgs/hero-6ad1b7b4a851a45e91418d443573f0c38accc78d-844x474.svg"
+tags:
+ - "announcement"
excerpt: |
The rapidly evolving AI coding agent landscape demands new infrastructure solutions that can keep up with the accelerating pace of app development. Prisma Postgres' ability to provision DB instances in single-digit miliseconds and without authentication is the best way to build AI-powered apps.
---
@@ -27,7 +29,7 @@ So what's the optimal approach to building fullstack applications while leveragi
AI coding tools exist along a spectrum of abstraction, each offering different levels of assistance and control. Which tool to reach for depends on your very-own experience and individual goals.
-
+
Let’s take a closer look at the levels of abstractions and where to place the most popular AI software development tools.
diff --git a/apps/blog/content/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/index.mdx b/apps/blog/content/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/index.mdx
index 099dd3358e..d68d4593b6 100644
--- a/apps/blog/content/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/index.mdx
+++ b/apps/blog/content/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Nikolas Burk"
metaTitle: "Announcing Prisma’s MCP Server: Vibe Code with Prisma Postgres"
metaDescription: "With Prisma’s MCP server, Cursor, Windsurf and other AI tools, can now provision and manage Postgres databases for your apps.."
-metaImagePath: "/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/imgs/meta-0e15503386e31edce5fd389f4b2ee52b0f71a162-1266x711.png"
-heroImagePath: "/blog/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/imgs/hero-7d96f16b30c6971db0da1e546a13a985ec47f6f3-844x474.svg"
+metaImagePath: "/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/imgs/meta-0e15503386e31edce5fd389f4b2ee52b0f71a162-1266x711.png"
+heroImagePath: "/announcing-prisma-s-mcp-server-vibe-code-with-prisma-postgres/imgs/hero-7d96f16b30c6971db0da1e546a13a985ec47f6f3-844x474.svg"
excerpt: |
With AI-native IDEs, we are all developing apps with remarkable speed. So much so that managing infrastructure is becoming the bottleneck. With [Prisma’s MCP server](https://www.prisma.io/docs/postgres/mcp-server), Cursor, Windsurf and other AI tools, can now provision and manage Postgres databases for your apps, so you don’t have to spend time fiddling with infrastructure.
---
diff --git a/apps/blog/content/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/index.mdx b/apps/blog/content/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/index.mdx
index 3dc96a97ba..ab4fc99ceb 100644
--- a/apps/blog/content/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/index.mdx
+++ b/apps/blog/content/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Ryan Chenkie"
metaTitle: "Announcing Nexus 1.0: Type-Safe, Code-First GraphQL APIs | Prisma"
metaDescription: "Nexus, the library for building code-first, type-safe GraphQL APIs has just reached 1.0."
-metaImagePath: "/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/imgs/meta-29585f8afef1e4c94930404a027807ca6ec0c2e3-2398x1208.png"
-heroImagePath: "/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/imgs/hero-807c11a11df0567a4b2ac96a0cac738b916d7416-1692x852.png"
+metaImagePath: "/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/imgs/meta-29585f8afef1e4c94930404a027807ca6ec0c2e3-2398x1208.png"
+heroImagePath: "/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b/imgs/hero-807c11a11df0567a4b2ac96a0cac738b916d7416-1692x852.png"
heroImageAlt: "Nexus 1.0: A Major Release for Type-Safe, Code-First GraphQL APIs"
excerpt: |
Prisma is a core contributor to Nexus, a library for building code-first and type-safe GraphQL APIs. Nexus has just reached 1.0. In this post, we'll recap what Nexus is and the value it brings and what's new at 1.0.
@@ -371,7 +371,7 @@ JSDoc support provides an improved developer experience. The content of the docs
- Links to the official docs
- Links to the GraphQL spec
-
+
#### Codesandbox Examples
diff --git a/apps/blog/content/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/index.mdx b/apps/blog/content/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/index.mdx
index 40d505ae9f..a43ceaf935 100644
--- a/apps/blog/content/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/index.mdx
+++ b/apps/blog/content/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/index.mdx
@@ -6,8 +6,12 @@ authors:
- "Nikolas Burk"
metaTitle: "Announcing TypedSQL: Make your raw SQL queries type-safe with Prisma ORM"
metaDescription: "Prisma ORM now supports the ability to write raw sql queries and have the inputs and outputs be fully type-safe! Get the benefit of a high-level API with the power of raw SQL."
-metaImagePath: "/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/imgs/meta-6212889ff7d56ad41636c0f7938159b1fd740651-1688x948.png"
-heroImagePath: "/blog/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/imgs/hero-9d1c710f959ab75107576ad53720a7731c75797a-844x474.png"
+metaImagePath: "/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/imgs/meta-6212889ff7d56ad41636c0f7938159b1fd740651-1688x948.png"
+heroImagePath: "/announcing-typedsql-make-your-raw-sql-queries-type-safe-with-prisma-orm/imgs/hero-9d1c710f959ab75107576ad53720a7731c75797a-844x474.png"
+tags:
+ - "newrelease-feature"
+ - "orm"
+ - "announcement"
excerpt: |
With today’s [v5.19.0](https://github.com/prisma/prisma/releases/tag/5.19.0) release, Prisma ORM introduces a new way to write raw SQL queries in a type-safe way! You now get the best of both worlds with Prisma ORM: A convenient high-level abstraction for the majority of queries _and_ a flexible, type-safe escape hatch for raw SQL.
---
diff --git a/apps/blog/content/blog/announcing-upcoming-course-8s41wdqrlgc7/index.mdx b/apps/blog/content/blog/announcing-upcoming-course-8s41wdqrlgc7/index.mdx
index 69e80f9316..55c175a2b2 100644
--- a/apps/blog/content/blog/announcing-upcoming-course-8s41wdqrlgc7/index.mdx
+++ b/apps/blog/content/blog/announcing-upcoming-course-8s41wdqrlgc7/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Mahmoud Abdelwahab"
metaTitle: "New Course: Fullstack App Using Next.js, GraphQL, TypeScript & Prisma TypeScript and Node.js ORM"
metaDescription: "We are working on a course, where you are going to learn how to build a fullstack app using Next.js, GraphQL, TypeScript and Prisma!"
-metaImagePath: "/blog/announcing-upcoming-course-8s41wdqrlgc7/imgs/hero-c4f6ff1ce0178636ddc08d50f408c042800bac92-1270x714.png"
-heroImagePath: "/blog/announcing-upcoming-course-8s41wdqrlgc7/imgs/hero-c4f6ff1ce0178636ddc08d50f408c042800bac92-1270x714.png"
+metaImagePath: "/announcing-upcoming-course-8s41wdqrlgc7/imgs/hero-c4f6ff1ce0178636ddc08d50f408c042800bac92-1270x714.png"
+heroImagePath: "/announcing-upcoming-course-8s41wdqrlgc7/imgs/hero-c4f6ff1ce0178636ddc08d50f408c042800bac92-1270x714.png"
heroImageAlt: "New Course: Fullstack App Using Next.js, GraphQL, TypeScript & Prisma"
+tags:
+ - "education"
excerpt: |
We're thrilled to announce that we're working on a new course where you'll learn how to build a fullstack app using
Next.js, GraphQL, TypeScript, and Prisma!
diff --git a/apps/blog/content/blog/aws-marketplace/index.mdx b/apps/blog/content/blog/aws-marketplace/index.mdx
index 1b8f0202a7..212db6ded9 100644
--- a/apps/blog/content/blog/aws-marketplace/index.mdx
+++ b/apps/blog/content/blog/aws-marketplace/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Nitin Gupta"
metaTitle: "Prisma products are now available for purchase on AWS Marketplace"
metaDescription: "AWS Marketplace customers can purchase Prisma products through AWS Marketplace."
-metaImagePath: "/blog/aws-marketplace/imgs/meta-328edbc9eaafbce2d4e09174ee22a13f77e758d3-1266x711.png"
-heroImagePath: "/blog/aws-marketplace/imgs/hero-f97462343e60a5322d236b809eaf9555aa725651-844x474.svg"
+metaImagePath: "/aws-marketplace/imgs/meta-328edbc9eaafbce2d4e09174ee22a13f77e758d3-1266x711.png"
+heroImagePath: "/aws-marketplace/imgs/hero-f97462343e60a5322d236b809eaf9555aa725651-844x474.svg"
heroImageAlt: "Prisma on AWS Marketplace"
+tags:
+ - "announcement"
excerpt: |
Customers can now purchase Prisma products through the familiar interface of AWS Marketplace and consolidate their infra spend under one billing system.
---
diff --git a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/index.mdx b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/index.mdx
index e5a4fa015e..dc9fa4ed3c 100644
--- a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/index.mdx
+++ b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/index.mdx
@@ -5,12 +5,11 @@ date: "2020-09-10"
authors:
- "Daniel Norman"
metaTitle: "TypeScript, PostgreSQL, Prisma Backend | Authentication, Authorization"
-metaImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/imgs/meta-9eae0d75afddb1fce65c68320479268f4cdcffd3-1692x852.png"
-heroImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/imgs/hero-9f73d35216a42b2bb796a971053669fbc90e36ee-846x426.svg"
+metaImagePath: "/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/imgs/meta-9eae0d75afddb1fce65c68320479268f4cdcffd3-1692x852.png"
+heroImagePath: "/backend-prisma-typescript-orm-with-postgresql-auth-mngp1ps7kip4/imgs/hero-9f73d35216a42b2bb796a971053669fbc90e36ee-846x426.svg"
heroImageAlt: "Backend with TypeScript, PostgreSQL & Prisma: Authentication & Authz"
series:
title: "Building a modern backend with TypeScript, PostgreSQL and Prisma"
- slug: "modern-backend-bdes2ps5kibb"
seriesIndex: 3
excerpt: |
In this third part of the series, we'll look at how to secure the REST API with passwordless authentication using Prisma for token storage and implement authorization.
@@ -149,7 +148,7 @@ Email-based passwordless authentication is a two-step process that involves two
The authentication flow will look as follows:
-
+
1. The user calls the `/login` endpoint in the API with the email in the payload to begin the authentication process.
2. If the email is new, the user is created in the _User_ table.
diff --git a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/index.mdx b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/index.mdx
index 39f6736de7..372d8548d9 100644
--- a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/index.mdx
+++ b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/index.mdx
@@ -5,12 +5,11 @@ date: "2020-07-30"
authors:
- "Daniel Norman"
metaTitle: "TypeScript, PostgreSQL, Prisma | Data Modeling, CRUD, Aggregates"
-metaImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/imgs/hero-df67ee11927bde800c1ba033b94e182ab3565110-1692x852.png"
-heroImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/imgs/hero-df67ee11927bde800c1ba033b94e182ab3565110-1692x852.png"
+metaImagePath: "/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/imgs/hero-df67ee11927bde800c1ba033b94e182ab3565110-1692x852.png"
+heroImagePath: "/backend-prisma-typescript-orm-with-postgresql-data-modeling-tsjs1ps7kip1/imgs/hero-df67ee11927bde800c1ba033b94e182ab3565110-1692x852.png"
heroImageAlt: "Backend with TypeScript PostgreSQL & Prisma: Data Modeling & CRUD"
series:
title: "Building a modern backend with TypeScript, PostgreSQL and Prisma"
- slug: "modern-backend-bdes2ps5kibb"
seriesIndex: 1
excerpt: |
This article is part of a series of [live streams](https://www.youtube.com/playlist?list=PLn2e1F9Rfr6k7ULe0gzQvtaXLoXrPqpki) and articles on building a backend with TypeScript, PostgreSQL, and Prisma. In this article, which summarizes the first live stream, we'll look at how to design the data model, perform CRUD operations, and query aggregates using Prisma.
@@ -111,7 +110,7 @@ The online grading system will have the following entities:
The entities can be visualized to demonstrate how they would be represented in a relational database (in this case PostgreSQL). The [diagram](https://dbdiagram.io/d/5f19635fe586385b4ff7a26d) below adds the columns relevant for each entity and foreign keys to describe the relationships between the entities.
-
+
The first thing to note about the diagram is that every entity maps to a database table.
diff --git a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/index.mdx b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/index.mdx
index 12f955c568..085c788fea 100644
--- a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/index.mdx
+++ b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/index.mdx
@@ -5,12 +5,11 @@ date: "2020-09-17"
authors:
- "Daniel Norman"
metaTitle: "TypeScript, PostgreSQL, Prisma | Continuous Integration & Deployment"
-metaImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/imgs/hero-d3aa9c3e0b081fe4d675e11574d1bbcf8ea9de46-1692x852.png"
-heroImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/imgs/hero-d3aa9c3e0b081fe4d675e11574d1bbcf8ea9de46-1692x852.png"
+metaImagePath: "/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/imgs/hero-d3aa9c3e0b081fe4d675e11574d1bbcf8ea9de46-1692x852.png"
+heroImagePath: "/backend-prisma-typescript-orm-with-postgresql-deployment-bbba1ps7kip5/imgs/hero-d3aa9c3e0b081fe4d675e11574d1bbcf8ea9de46-1692x852.png"
heroImageAlt: "Backend with TypeScript, PostgreSQL & Prisma: CI & Deployment"
series:
title: "Building a modern backend with TypeScript, PostgreSQL and Prisma"
- slug: "modern-backend-bdes2ps5kibb"
seriesIndex: 4
excerpt: |
In this fourth part of the series, we'll configure continuous integration (CI) and continuous deployment (CD) with GitHub Actions to test and deploy the backend to Heroku.
@@ -182,11 +181,11 @@ Begin by forking the [GitHub repository](https://github.com/2color/real-world-gr
Once forked, go to the _actions_ tab on Github:
-
+
Enable the workflow by clicking on the enable button:
-
+
Now, when you push a commit to the repository, GitHub will run the workflow.
@@ -251,21 +250,21 @@ heroku config:get DATABASE_URL
The Heroku API key can be retrieved from your [Heroku account settings](https://dashboard.heroku.com/account):
-
+
### Creating the secrets in GitHub
To create the four secrets, go to the repository settings and open the _Secrets_ tab:
-
+
Click on **New secret**, use the name field for the secret name, e.g., `HEROKU_APP_NAME` and set the value:
-
+
**Checkpoint:** After creating the four secrets, you should see the following:
-
+
## Defining the environment variables on Heroku
@@ -296,17 +295,17 @@ git push
```
Once you have pushed a commit, go to the Actions tab of your GitHub repository and you should see the following:
-
+
Click on the first row in the table with the commit message:
-
+
## Viewing the logs for the `test` job
To view the logs for the `test` job, click on `test` which should allow you to view the logs for each step. For example, in the screenshot below, you can view the results of the tests:
-
+
## Verifying the deployment to Heroku
@@ -314,7 +313,7 @@ To verify that `deploy` job successfully deployed to Heroku, click on `deploy` o
```
remote: https://***.herokuapp.com/ deployed to Heroku
```
-
+
To access the API from the browser, use the following Heroku CLI command, from the cloned repository folder:
```
diff --git a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/index.mdx b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/index.mdx
index 3bea4e4049..2d88b748a3 100644
--- a/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/index.mdx
+++ b/apps/blog/content/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/index.mdx
@@ -5,12 +5,11 @@ date: "2020-08-20"
authors:
- "Daniel Norman"
metaTitle: "TypeScript, PostgreSQL, Prisma Backend | REST API, Validation, Testing"
-metaImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/imgs/hero-21fe21324bb4e62111c88b37b71091676e29f616-1692x852.png"
-heroImagePath: "/blog/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/imgs/hero-21fe21324bb4e62111c88b37b71091676e29f616-1692x852.png"
+metaImagePath: "/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/imgs/hero-21fe21324bb4e62111c88b37b71091676e29f616-1692x852.png"
+heroImagePath: "/backend-prisma-typescript-orm-with-postgresql-rest-api-validation-dcba1ps7kip3/imgs/hero-21fe21324bb4e62111c88b37b71091676e29f616-1692x852.png"
heroImageAlt: "Backend with TypeScript, PostgreSQL & Prisma: REST, Validation & Tests"
series:
title: "Building a modern backend with TypeScript, PostgreSQL and Prisma"
- slug: "modern-backend-bdes2ps5kibb"
seriesIndex: 2
excerpt: |
This article is part of a series of [live streams](https://www.youtube.com/playlist?list=PLn2e1F9Rfr6k7ULe0gzQvtaXLoXrPqpki) and articles on building a backend with TypeScript, PostgreSQL, and Prisma. In this article, we'll look at how to build a REST API, validate input, and testing the API.
diff --git a/apps/blog/content/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/index.mdx b/apps/blog/content/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/index.mdx
index df9ecf9f92..9bfa6fc806 100644
--- a/apps/blog/content/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/index.mdx
+++ b/apps/blog/content/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Ankur Datta"
metaTitle: "Database Caching: A Double-Edged Sword? Examining the Pros and Cons"
metaDescription: "Discover the advantages and hurdles of caching database query results. Learn how caching enhances performance, scalability, and resource utilization, while also delving into the associated challenges."
-metaImagePath: "/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/imgs/meta-72680f73691cdf86b51087621b4b0e79ac12fde7-1266x712.png"
-heroImagePath: "/blog/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/imgs/hero-ce90e81e707c3b5735077783e1db72216b8a56dd-844x474.svg"
+metaImagePath: "/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/imgs/meta-72680f73691cdf86b51087621b4b0e79ac12fde7-1266x712.png"
+heroImagePath: "/benefits-and-challenges-of-caching-database-query-results-x2s9ei21e8kq/imgs/hero-ce90e81e707c3b5735077783e1db72216b8a56dd-844x474.svg"
heroImageAlt: "Database Caching"
+tags:
+ - "education"
excerpt: |
Caching database query results can have amazing benefits for performance, cost efficiency and user
experience! In this article, we'll talk about these benefits as well as the challenges and drawbacks of database
@@ -33,15 +35,15 @@ excerpt: |
When creating a web application, retrieving data from a database is essential. However, as your traffic and database size grows, database queries can become progressively slower. To provide fast responses to users, caching database query results can be a cost-effective and simple solution instead of implementing complex query optimizations or upgrading your database.
-
-
+
+
### Caching significantly improves performance
Using a cache to store database query results can significantly boost the performance of your application. A database cache is much faster and usually hosted closer to the application server, which reduces the load on the main database, accelerates data retrieval, and minimizes network and query latency.
-
-
+
+
#### Faster data retrieval
@@ -57,8 +59,8 @@ By efficiently utilizing resources, system resources are freed up in both the da
In addition to performance enhancements, caching also plays a crucial role in improving the scalability of your application, allowing it to handle increased loads and accommodate higher user concurrency and more extensive data volumes.
-
-
+
+
#### Reduced application server and database load
@@ -93,7 +95,7 @@ Time is crucial in determining when to invalidate the cache. Invalidating it too
A cache can store a large amount of data, and it is difficult to know which cached data to invalidate when a subset of that data changes in the underlying database. Fine-grained cache invalidation can be an expensive operation, while coarse-grained invalidation results in unnecessary data being removed.
-
+
#### Coherency
@@ -101,7 +103,7 @@ When using a globally distributed cache, invalidating a cache item requires that
A load balancer should be used between your application servers and distributed cache servers to manage traffic. Additionally, a synchronization mechanism is required to reflect changes across all cache nodes to prevent the serving of stale data.
-
+
### A caching system can be complicated to manage
@@ -109,7 +111,7 @@ Hosting and managing a cache layer between your server and database requires add
Situations such as a _cache avalanche_ may occur when, for some reason, the cache set or the cache system fails, or there is no data in the cache within a short period of time. When this happens, all concurrent traffic goes directly to the database, putting extensive pressure on it. As a result, there is a significant drop in application performance, which can cause downtime.
-
+
To avoid such scenarios, proper planning, expertise, and ongoing maintenance are necessary to handle these complexities and ensure a reliable and high-performance caching infrastructure.
@@ -119,7 +121,7 @@ Caching utilizes memory storage to enable fast data retrieval. However, managed
To estimate the optimal cache size, historical usage patterns, workload characteristics, and anticipated growth should be taken into consideration. Scaling the cache capacity based on these insights ensures efficient resource utilization and performance while managing the cost of memory allocation against caching benefits.
-
+
### Synchronizing the cache globally is challenging
diff --git a/apps/blog/content/blog/bfg/index.mdx b/apps/blog/content/blog/bfg/index.mdx
index 1eab62ceed..5ff2cda091 100644
--- a/apps/blog/content/blog/bfg/index.mdx
+++ b/apps/blog/content/blog/bfg/index.mdx
@@ -7,9 +7,11 @@ authors:
- "Nitin Gupta"
metaTitle: "Explanation of Prisma's Build, Fortify, Grow (BFG) Framework"
metaDescription: "An overview of how Prisma products interoperate at each stage and aid in enhancing data-driven application development."
-metaImagePath: "/blog/bfg/imgs/meta-48f848dd9b8582c9e4ce13d14f2001a485d281d3-1266x711.png"
-heroImagePath: "/blog/bfg/imgs/hero-9e46446f32d354d43e61580e8fc6f1855839e4e5-844x474.svg"
+metaImagePath: "/bfg/imgs/meta-48f848dd9b8582c9e4ce13d14f2001a485d281d3-1266x711.png"
+heroImagePath: "/bfg/imgs/hero-9e46446f32d354d43e61580e8fc6f1855839e4e5-844x474.svg"
heroImageAlt: "Build, Fortify, Grow Framework"
+tags:
+ - "announcement"
excerpt: |
Dive into Prisma’s ‘Build, Fortify, Grow’ framework. Learn how Prisma products interoperate at each stage of the framework, and aid in enhancing data-driven application development.
---
diff --git a/apps/blog/content/blog/bringing-prisma-orm-to-react-native-and-expo/index.mdx b/apps/blog/content/blog/bringing-prisma-orm-to-react-native-and-expo/index.mdx
index bb92258f90..56ed6413fa 100644
--- a/apps/blog/content/blog/bringing-prisma-orm-to-react-native-and-expo/index.mdx
+++ b/apps/blog/content/blog/bringing-prisma-orm-to-react-native-and-expo/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Søren Bramer Schmidt"
metaTitle: "Bringing Prisma ORM to React Native and Expo"
metaDescription: "Prisma ORM now provides Early Access support for React Native and Expo. The integration introduces reactive queries, using React hooks to auto-update the UI when the underlying data changes."
-metaImagePath: "/blog/bringing-prisma-orm-to-react-native-and-expo/imgs/meta-289f00bdde5d5f308f3faa684d09f647974d77b6-1200x630.png"
-heroImagePath: "/blog/bringing-prisma-orm-to-react-native-and-expo/imgs/hero-bbb1e7f6b0f7bef3d318fac96652548cad0ef0b5-844x474.svg"
+metaImagePath: "/bringing-prisma-orm-to-react-native-and-expo/imgs/meta-289f00bdde5d5f308f3faa684d09f647974d77b6-1200x630.png"
+heroImagePath: "/bringing-prisma-orm-to-react-native-and-expo/imgs/hero-bbb1e7f6b0f7bef3d318fac96652548cad0ef0b5-844x474.svg"
+tags:
+ - "newrelease-feature"
excerpt: |
Prisma ORM now provides Early Access support for React Native and Expo, fulfilling a popular community request. The integration introduces *reactive queries*, using React hooks to auto-update the UI when the underlying data changes.
---
diff --git a/apps/blog/content/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/index.mdx b/apps/blog/content/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/index.mdx
index 8b95325470..72b781322d 100644
--- a/apps/blog/content/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/index.mdx
+++ b/apps/blog/content/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/index.mdx
@@ -5,9 +5,11 @@ date: "2020-12-17"
authors:
- "Ryan Chenkie"
metaTitle: "How to build an App With Svelte and TypeScript | Prisma"
-metaImagePath: "/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/imgs/meta-711f2d3f2094907c22c0ef2dd88e69992f950026-2400x1256.png"
-heroImagePath: "/blog/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/imgs/hero-0e8c20420d860a393f68694b8bab707306822df3-1692x852.png"
+metaImagePath: "/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/imgs/meta-711f2d3f2094907c22c0ef2dd88e69992f950026-2400x1256.png"
+heroImagePath: "/build-an-app-with-svelte-and-typescript-pzdy3t93qatd/imgs/hero-0e8c20420d860a393f68694b8bab707306822df3-1692x852.png"
heroImageAlt: "Build an App With Svelte and TypeScript"
+tags:
+ - "education"
excerpt: |
TypeScript is all the rage across the whole stack and, increasingly, in every frontend framework. Svelte now comes with TypeScript support. Learn how to build a Svelte app using TypeScript and find out how you can get greater confidence and better developer ergonimics as you do.
@@ -142,7 +144,7 @@ In `App.svelte`, import and use the `Users` component so we can see the results
Refresh the page to make sure the results come through.
-
+
Next, let's add a template to the `Users` component to render the data. We'll use an Await block, as well as an Each block to iterate over the users.
@@ -185,11 +187,11 @@ We've adjusted the `getUsers` call to create a reactive declaration. This allows
We're awaiting this promise using an Await block in the template and then using an Each block to loop over and display each entry.
-
+
If you are using an editor that has TypeScript support such as VS Code, you should now see issues when trying to access the `avatar_url` and `login` properties.
-
+
To fix this, we need to make our component aware of the type information for this data.
@@ -344,7 +346,7 @@ The key thing to point out in this setup is that we have type safety for the inp
userLogin={42}
/>
```
-
+
Right now we have `any` applied as the return type to the `getUserDetails` function in `UserDetails.svelte`. Let's apply type-safety here by defining a type and using it.
@@ -515,7 +517,7 @@ This will open up Prisma Studio in the browser at `http://locahost:5555`.
We can click into the `User` table to view it. We can also take this opportunity to create some new data right through the UI.
-
+
### Create an Endpoint to Get the User Data
@@ -589,7 +591,7 @@ In the Svelte project, let's swap our the github.com URL in the fetch call in `U
With this simple change, we should now be getting data from our server instead of from GitHub.
-
+
## Wrapping Up
diff --git a/apps/blog/content/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/index.mdx b/apps/blog/content/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/index.mdx
index 3ebe39cfb2..31a0f61a9e 100644
--- a/apps/blog/content/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/index.mdx
+++ b/apps/blog/content/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/index.mdx
@@ -6,8 +6,12 @@ authors:
- "Nikolas Burk"
metaTitle: "Build Applications at the Edge with Prisma ORM & Cloudflare D1 (Preview)1"
metaDescription: "Prisma ORM now supports Cloudflare D1 databases. Read this article to learn how to query D1 from a Cloudflare Worker."
-metaImagePath: "/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/imgs/meta-9804cde42d974d63b5a3b8bc951c13aeb9187101-1266x711.png"
-heroImagePath: "/blog/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/imgs/hero-66fc05379af15d65fd3dd6d792c9a575db648895-844x474.png"
+metaImagePath: "/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/imgs/meta-9804cde42d974d63b5a3b8bc951c13aeb9187101-1266x711.png"
+heroImagePath: "/build-applications-at-the-edge-with-prisma-orm-and-cloudflare-d1-preview/imgs/hero-66fc05379af15d65fd3dd6d792c9a575db648895-844x474.png"
+tags:
+ - "announcement"
+ - "orm"
+ - "newrelease-feature"
excerpt: |
Cloudflare has been pioneering the edge computing landscape since the introduction of Workers in 2017. With [D1](https://developers.cloudflare.com/d1/), Cloudflare recently released a native serverless database. We’re excited to announce that you can now talk to D1 using Prisma ORM!
---
@@ -48,7 +52,7 @@ At Prisma, we believe that Cloudflare is at the forefront of building the future
[Supporting D1](https://github.com/prisma/prisma/issues/13310) has been one of the most popular feature requests for Prisma ORM on GitHub.
-
+
As a strong believer in Cloudflare as a technology provider, we're thrilled to share that you can now use Prisma ORM inside Cloudflare Workers (and Pages) to access a D1 database.
@@ -76,7 +80,7 @@ This will bring up a CLI wizard. Select all the _default_ options by hitting **R
At the end of the wizard, you should have a deployed Cloudflare Worker at the domain `https://prisma-d1-example.USERNAME.workers.dev` which simply renders "Hello World" in the browser:
-
+
### 2. Initialize Prisma ORM
@@ -300,7 +304,7 @@ npm run deploy
As before, your deployed Worker is accessible via `https://prisma-d1-example.USERNAME.workers.dev`. If you navigate your browser to that URL, you should see the following data that's queried from your remote D1 database:
-
+
Congratulations, you just deployed a Cloudflare Worker using D1 as a database and querying it via Prisma ORM 🎉
diff --git a/apps/blog/content/blog/caching-database-queries-with-prisma-accelerate/index.mdx b/apps/blog/content/blog/caching-database-queries-with-prisma-accelerate/index.mdx
index a438c41fff..eeb80187a3 100644
--- a/apps/blog/content/blog/caching-database-queries-with-prisma-accelerate/index.mdx
+++ b/apps/blog/content/blog/caching-database-queries-with-prisma-accelerate/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Jon Harrell"
metaTitle: "Cache your database queries with Prisma Accelerate"
metaDescription: "Achieve faster performance and cost savings with Prisma Accelerate's easy per-query caching, eliminating the need for maintaining caching infrastructure. Experience faster queries, without the hassle!"
-metaImagePath: "/blog/caching-database-queries-with-prisma-accelerate/imgs/meta-959743e064c1771e65e078aa6ebee2b402c28578-1266x711.png"
-heroImagePath: "/blog/caching-database-queries-with-prisma-accelerate/imgs/hero-69cd8d277e2307eb14396450817be41bb1e7c305-844x474.svg"
+metaImagePath: "/caching-database-queries-with-prisma-accelerate/imgs/meta-959743e064c1771e65e078aa6ebee2b402c28578-1266x711.png"
+heroImagePath: "/caching-database-queries-with-prisma-accelerate/imgs/hero-69cd8d277e2307eb14396450817be41bb1e7c305-844x474.svg"
heroImageAlt: "The word \"caching\" with a starburst behind it, showing that it is important."
excerpt: |
Dive into the benefits of per-query caching, showcasing how it can make queries faster, handle traffic surges, minimize infrastructure costs, and keep your users satisfied. Learn how to easily implement Prisma Accelerate and achieve improved app performance and cost savings.
@@ -25,9 +25,9 @@ While your team was capable, fire drills and all-nighters are the last thing you
As you saw in the above example, caching is great when you need to reduce database or application load. By caching, you can remove expensive operations from the time it takes to load your application, also known as the “critical path”. Following requests can then use this cached data to avoid spending app or database time computing the result. If improved stability due to reduced app load wasn’t enough, less time spent computing also means your infrastructure can support a higher workload, or your app can run on reduced hardware, saving you money!
-
+
-
+
Another reason to cache would be to reduce egress costs. Many cloud providers charge egress costs for data leaving their services. This could be rows being served from your database, static images, even responses to or from other services.
@@ -62,7 +62,7 @@ As you saw above, adding caching with Prisma Accelerate is as easy as adding a `
In addition to being able to quickly and easily implement caching, using Prisma Accelerate also means no need to set up additional caching infrastructure. While cloud providers have managed key-value stores, in the best case, you still need to manually insert data, manage indexes and replication, and be sure to invalidate when things change. With Prisma Accelerate, this is all handled for you! Add a cache strategy for the query you would like to cache and move on to building more great things.
-
+
### Is Prisma Accelerate right for me?
diff --git a/apps/blog/content/blog/client-extensions-ga-4g4yiu8eosbb/index.mdx b/apps/blog/content/blog/client-extensions-ga-4g4yiu8eosbb/index.mdx
index b6af2d132d..d852e03af5 100644
--- a/apps/blog/content/blog/client-extensions-ga-4g4yiu8eosbb/index.mdx
+++ b/apps/blog/content/blog/client-extensions-ga-4g4yiu8eosbb/index.mdx
@@ -6,9 +6,13 @@ authors:
- "Jon Harrell"
metaTitle: "Prisma Client Extensions Are Now Production Ready (4.16.0)"
metaDescription: "Make Prisma Client do even more with Client extensions, now Generally Available. Extend your client, models, queries, and results to tailor Prisma Client to your use case."
-metaImagePath: "/blog/client-extensions-ga-4g4yiu8eosbb/imgs/meta-50e7e57ea5967ad67ce89e682aca57f5e19fd65a-1266x712.png"
-heroImagePath: "/blog/client-extensions-ga-4g4yiu8eosbb/imgs/hero-b404c12ca7de2f9288368dacbce578b790bfd66d-844x474.svg"
+metaImagePath: "/client-extensions-ga-4g4yiu8eosbb/imgs/meta-50e7e57ea5967ad67ce89e682aca57f5e19fd65a-1266x712.png"
+heroImagePath: "/client-extensions-ga-4g4yiu8eosbb/imgs/hero-b404c12ca7de2f9288368dacbce578b790bfd66d-844x474.svg"
heroImageAlt: "Prisma Client Extensions"
+tags:
+ - "orm"
+ - "announcement"
+ - "newrelease-feature"
excerpt: |
With the release of version [4.16.0](https://github.com/prisma/prisma/releases/tag/4.16.0) of the Prisma ORM, [Client extensions](https://www.prisma.io/docs/orm/prisma-client/client-extensions) are now Generally Available! This new feature allows users to extend and customize Prisma Client to meet their individual use cases.
diff --git a/apps/blog/content/blog/client-extensions-preview-8t3w27xkrxxn/index.mdx b/apps/blog/content/blog/client-extensions-preview-8t3w27xkrxxn/index.mdx
index 608250b737..513706d4fa 100644
--- a/apps/blog/content/blog/client-extensions-preview-8t3w27xkrxxn/index.mdx
+++ b/apps/blog/content/blog/client-extensions-preview-8t3w27xkrxxn/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Stephen King"
metaTitle: "Prisma Client Just Became a Lot More Flexible: Prisma Client Extensions (Preview)"
metaDescription: "Learn how Prisma Client extensions (Preview) enable a variety of new use cases for the Prisma ORM."
-metaImagePath: "/blog/client-extensions-preview-8t3w27xkrxxn/imgs/meta-5ca8711a05c2f835cfce511739e46b5f6df982cd-1266x712.png"
-heroImagePath: "/blog/client-extensions-preview-8t3w27xkrxxn/imgs/hero-1b0474b02ed0759af1c6e3f3bcba5d4ebb1d970b-844x474.svg"
+metaImagePath: "/client-extensions-preview-8t3w27xkrxxn/imgs/meta-5ca8711a05c2f835cfce511739e46b5f6df982cd-1266x712.png"
+heroImagePath: "/client-extensions-preview-8t3w27xkrxxn/imgs/hero-1b0474b02ed0759af1c6e3f3bcba5d4ebb1d970b-844x474.svg"
heroImageAlt: "Prisma Client Just Became a Lot More Flexible: Prisma Client Extensions (Preview)"
+tags:
+ - "newrelease-feature"
+ - "orm"
excerpt: |
[Prisma Client extensions](https://www.prisma.io/docs/concepts/components/prisma-client/client-extensions) (in Preview) enable many new use cases. This article will explore various ways you can use extensions to add custom functionality to Prisma Client.
diff --git a/apps/blog/content/blog/cloud-connectivity-report-2024/index.mdx b/apps/blog/content/blog/cloud-connectivity-report-2024/index.mdx
index 1f992619b8..1e1041a051 100644
--- a/apps/blog/content/blog/cloud-connectivity-report-2024/index.mdx
+++ b/apps/blog/content/blog/cloud-connectivity-report-2024/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Søren Bramer Schmidt"
metaTitle: "Prisma's Cloud Connectivity Report 2024"
metaDescription: "The Prisma Cloud Connectivity Report 2024 analyzes AWS and Cloudflare latency, highlighting regions with the fastest and slowest connectivity."
-metaImagePath: "/blog/cloud-connectivity-report-2024/imgs/meta-4081c40e88b18cc130df73ce6102d5154c7ad39c-1200x630.png"
-heroImagePath: "/blog/cloud-connectivity-report-2024/imgs/hero-cb3b5906c2776d8457722f79222e915cd08aa6a3-844x474.svg"
+metaImagePath: "/cloud-connectivity-report-2024/imgs/meta-4081c40e88b18cc130df73ce6102d5154c7ad39c-1200x630.png"
+heroImagePath: "/cloud-connectivity-report-2024/imgs/hero-cb3b5906c2776d8457722f79222e915cd08aa6a3-844x474.svg"
excerpt: |
The Prisma Cloud Connectivity Report 2024 analyzes network latency between AWS regions and Cloudflare PoPs, identifying regions with the fastest and slowest connectivity. It highlights the impact of physical infrastructure and geographical distance on latency, providing insights for optimizing cloud connectivity and data exchange efficiency.
---
@@ -21,29 +21,29 @@ We collect p50, p90, p95, p99 and p999 latency metrics for the intersection of 1
## AWS regions with the fastest connectivity to Cloudflare
The three AWS regions with the lowest latency to a nearby Cloudflare PoP are all in Asia Pacific:
-
+
Fastest of all, ap-south-1 (Mumbai) [opened in 2016](https://aws.amazon.com/about-aws/whats-new/2016/06/announcing-the-aws-asia-pacific-mumbai-region/) and has a p50 latency to the nearby Cloudflare [BOM PoP](https://where.durableobjects.live/colo/BOM) of 10.9ms. Second, ap-southeast-1 (Singapore) [opened in 2010](https://aws.amazon.com/about-aws/whats-new/2010/04/29/announcing-asia-pacific-singapore-region/) and has a p50-latency to the nearby [SIN PoP](https://where.durableobjects.live/colo/SIN) of 12.3 ms. Finally, the ap-southeast-2 (Sydney) region [opened in 2012](https://aws.amazon.com/about-aws/whats-new/2012/11/12/announcing-the-aws-asia-pacific-sydney-region/) and has a p50 latency of 15.8ms to the nearby [SYD PoP](https://where.durableobjects.live/colo/SYD).
To understand why some AWS regions have really low latency access to a Cloudflare PoP, all you need to do is follow the wire. At the end of the day, these are physical networks with fiber optics connecting them at an Interconnection Facility. As an example, the [ap-south-1 (Mumbai) AWS region](https://www.peeringdb.com/net/1418) is peering at three facilities:
-
+
The [Cloudflare BOM (Mumbai)](https://www.peeringdb.com/net/4224) PoP is also peering the Equinix MB1 facility, so the network distance between the Cloudflare and AWS facilities in Mumbai is very short:
-
+
Contrast this with the us-east-2 AWS region in Columbus, Ohio which has a p50 that is almost three times as high to the nearest [Cloudflare PoP CMH](https://where.durableobjects.live/colo/CMH), which is also in Columbus:
-
+
us-east-2 is peering at just a single interconnection facility:
-
+
Cloudflare also has a PoP in Columbus, but it is peering at a different Cologix facility, resulting in additional network hops:
-
+
## Latency maps for popular AWS regions
@@ -51,17 +51,17 @@ A benefit of the Cloudflare edge network is that they have PoPs in many cities.
### us-east-1
-
+
### eu-central-1
-
+
## High latency connections
[Prisma Accelerate](http://prisma.io/accelerate) is a global database cache, increasing the performance of websites that are deployed in multiple regions and communicating with a central database. As such, we see traffic from almost all Cloudflare PoPs to any given AWS region. These are the AWS region and Cloudflare PoP pairs where we observe the highest latency:
-
+
It’s no surprise that these are connections over a very long distance. Buenos Aires to Ireland, Hong Kong to Sweden, and Johannesburg to Sydney.
diff --git a/apps/blog/content/blog/cloudflare-partnership-qerefgvwirjq/index.mdx b/apps/blog/content/blog/cloudflare-partnership-qerefgvwirjq/index.mdx
index 9e93f75a0c..68545aaf3b 100644
--- a/apps/blog/content/blog/cloudflare-partnership-qerefgvwirjq/index.mdx
+++ b/apps/blog/content/blog/cloudflare-partnership-qerefgvwirjq/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Nitin Gupta"
metaTitle: "Developer Experience Redefined: Prisma & Cloudflare Lead the Way to Data DX"
metaDescription: "Prisma introduces Data DX and announces a partnership with Cloudflare"
-metaImagePath: "/blog/cloudflare-partnership-qerefgvwirjq/imgs/meta-c3dfb4dc0d8bc7d99b379b6e68668c6135aca53c-1266x711.png"
-heroImagePath: "/blog/cloudflare-partnership-qerefgvwirjq/imgs/hero-726190b9f3c5c097cc8cfa5dc08581458138758f-844x474.svg"
+metaImagePath: "/cloudflare-partnership-qerefgvwirjq/imgs/meta-c3dfb4dc0d8bc7d99b379b6e68668c6135aca53c-1266x711.png"
+heroImagePath: "/cloudflare-partnership-qerefgvwirjq/imgs/hero-726190b9f3c5c097cc8cfa5dc08581458138758f-844x474.svg"
heroImageAlt: "hero image prisma"
+tags:
+ - "announcement"
excerpt: |
Prisma and Cloudflare join forces to introduce Data Developer Experience (Data DX), revolutionizing data-driven applications. The partnership offers innovative tools and cloud infrastructure, reducing setup time and accelerating time-to-market for users.
diff --git a/apps/blog/content/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/index.mdx b/apps/blog/content/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/index.mdx
index fa5aeafc80..2312056483 100644
--- a/apps/blog/content/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/index.mdx
+++ b/apps/blog/content/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Nikolas Burk"
metaTitle: "Cloudflare, Unikernels & Bare Metal: Life of a Prisma Postgres Query"
metaDescription: "Take a look under the hood of the most innovative PostgreSQL database on the market and learn how a query travels through Cloudflare, unikernels and bare metal."
-metaImagePath: "/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/imgs/meta-b078a6114c23eb0c00322a230a463628f4799fb4-1266x711.png"
-heroImagePath: "/blog/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/imgs/hero-e23d2415c9dce256ee6090919392141e9da30678-844x474.svg"
+metaImagePath: "/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/imgs/meta-b078a6114c23eb0c00322a230a463628f4799fb4-1266x711.png"
+heroImagePath: "/cloudflare-unikernels-and-bare-metal-life-of-a-prisma-postgres-query/imgs/hero-e23d2415c9dce256ee6090919392141e9da30678-844x474.svg"
excerpt: |
[Prisma Postgres](https://www.prisma.io/postgres) is the most innovative PostgreSQL database on the market. In this article, we dive deep into its technology stack, which enables lightning-fast queries, global caching, connection pooling, and more.
---
@@ -42,7 +42,7 @@ Here's what developers get when using Prisma Postgres as their serverless databa
With our short recap out of the way, let's dive into the tech stack Prisma Postgres uses to enable these benefits. Spoiler: Here's the full overview of all components involved in the lifecycle of a Prisma Postgres query:
-
+
In the next sections, we'll take a closer look at each stage and explain what's going on under the covers.
@@ -123,7 +123,7 @@ The auth layer is implemented using Cloudflare Workers, and therefore in close p
After authentication, the HTTP request is going to hit the next layer of the Prisma Postgres infrastructure which is implemented via Cloudflare Workers as well:
-
+
The main purpose of this routing layer is to determine whether the Prisma Postgres cache needs to be activated:
@@ -138,7 +138,7 @@ As a cache key, it uses a hash that's computed based on the _entire_ Prisma ORM
You can see the statistics of your caching behavior in the Prisma Postgres dashboard:
-
+
Let's now assume our query from before continues to travel down the Prisma Postgres stack and is not served by the cache. What happens next?
@@ -160,7 +160,7 @@ Prisma Postgres is based on _unikernels_ (think: "hyper-specialized operating s
Here's an overview of the Unikraft Cloud's [core components](https://unikraft.cloud/how-it-works/) that enables the lightning-fast startup times of Prisma Postgres instances:
-
+
And this is how these components work together:
@@ -187,7 +187,7 @@ While we've seen a lot of excitement about the current technology stack and the
There are a number of additional optimizations that we see possible in future iterations of Prisma Postgres, most notably: We are going to move the connection pool onto the _same machines_ that are running the Prisma Postgres instances:
-
+
The TCP connection is the most expensive part in the entire stack, due to the three-way handshake that needs to be done every time a connection is established. By reducing this TCP connection to a merely local one happening between two processes on the same machine, the latency caused by the physical distance between the connection pool and database instance would become entirely negligible.
diff --git a/apps/blog/content/blog/cockroach-ga-5jrd9xvwqdyl/index.mdx b/apps/blog/content/blog/cockroach-ga-5jrd9xvwqdyl/index.mdx
index b0c46656b1..a24f850325 100644
--- a/apps/blog/content/blog/cockroach-ga-5jrd9xvwqdyl/index.mdx
+++ b/apps/blog/content/blog/cockroach-ga-5jrd9xvwqdyl/index.mdx
@@ -6,9 +6,13 @@ authors:
- "Sabin Adams"
metaTitle: "Prisma support for CockroachDB is now in GA"
metaDescription: "Prisma's support for CockroachDB is now in production ready! Read this article to learn about the features and benefits of Prisma with CockroachDb."
-metaImagePath: "/blog/cockroach-ga-5jrd9xvwqdyl/imgs/meta-77148d314c74789939fb2b2af2bf3f82378cebc0-1920x1080.png"
-heroImagePath: "/blog/cockroach-ga-5jrd9xvwqdyl/imgs/hero-ebf53ec190dab44f271d4f0dd1ad658507f55b66-844x474.svg"
+metaImagePath: "/cockroach-ga-5jrd9xvwqdyl/imgs/meta-77148d314c74789939fb2b2af2bf3f82378cebc0-1920x1080.png"
+heroImagePath: "/cockroach-ga-5jrd9xvwqdyl/imgs/hero-ebf53ec190dab44f271d4f0dd1ad658507f55b66-844x474.svg"
heroImageAlt: "Prisma Support for CockroachDB Is Production Ready"
+tags:
+ - "announcement"
+ - "newrelease-feature"
+ - "orm"
excerpt: |
On May 10th, we were thrilled to release version [3.14.0](https://github.com/prisma/prisma/releases/tag/3.14.0) of
Prisma ORM, which brought [CockroachDB](https://www.cockroachlabs.com/product/) support to GA! This production-ready
@@ -22,7 +26,7 @@ Back in February, as part of the [3.9.0](https://github.com/prisma/prisma/releas
Thanks to the amazing community feedback and testing, along with collaboration from the amazing [Cockroach Labs](https://www.cockroachlabs.com/) team, this feature is now production-ready!
-
+
## The power of serverless with a familiar interface
@@ -37,7 +41,7 @@ Using Prisma with CockroachDB is, for the most part, the same as using Prisma wi
The magic behind Prisma _with_ CockroachDB is that developers now have access to the scalable infrastructure of a distributed SQL database without having to be an expert in hosting and scaling databases. CockroachDB handles that piece of things so developers can focus on building their product rather than spending time on operational overhead.
-
+
The developer's experience when interacting with their CockroachDB database (or database cluster) is made super smooth as Prisma helps maintain advanced developer confidence and productivity via its type-safe client and migration tools while CockroachDB handles the complicated operational tasks such as:
@@ -68,7 +72,7 @@ Then create a new migration to account for that change.
```shell
npx prisma migrate dev --name add-age
```
-
+
Finally, ideally during a CI/CD step, the changes can be deployed to the database and CockroachDB will apply these across all of the databases in the cluster without downtime.
@@ -83,7 +87,7 @@ Prisma Schema Language (PSL) supports configuring [indexes](https://www.prisma.i
This, along with CockroachDB's [statement monitoring page](https://www.cockroachlabs.com/docs/stable/ui-statements-page.html) provide a super useful set of tools that empower developers to have clear insights into their queries' performance and pathways to optimizing them.
-
+
## Get started with CockroachDB and Prisma
diff --git a/apps/blog/content/blog/compliance-reqs-complete/index.mdx b/apps/blog/content/blog/compliance-reqs-complete/index.mdx
index d12ae06f12..14e7c713d0 100644
--- a/apps/blog/content/blog/compliance-reqs-complete/index.mdx
+++ b/apps/blog/content/blog/compliance-reqs-complete/index.mdx
@@ -7,9 +7,11 @@ authors:
- "Josh McLeod"
metaTitle: "Prisma completes HIPAA, GDPR, ISO27001, SOC2 compliance requirements."
metaDescription: "Prisma completes the compliance requirements for GDPR, HIPAA, ISO27001 and SOC2-TypeII certifications"
-metaImagePath: "/blog/compliance-reqs-complete/imgs/meta-457925aa50c548e3c000c94e5dab3874b4272046-1266x711.png"
-heroImagePath: "/blog/compliance-reqs-complete/imgs/hero-d21f1c5e95d54f9016987dc7885b6b032c1bc140-844x474.svg"
+metaImagePath: "/compliance-reqs-complete/imgs/meta-457925aa50c548e3c000c94e5dab3874b4272046-1266x711.png"
+heroImagePath: "/compliance-reqs-complete/imgs/hero-d21f1c5e95d54f9016987dc7885b6b032c1bc140-844x474.svg"
heroImageAlt: "Prisma completes compliance requirements for GDPR, HIPAA, ISO27001 and SOC2-TypeII certifications."
+tags:
+ - "announcement"
excerpt: |
Prisma has successfully implemented processes and controls required for SOC2 Type II, HIPAA, GDPR, and ISO 27001:2022 certifications. These accomplishments demonstrate our commitment to providing secure and reliable software solutions for developers working with databases.
---
diff --git a/apps/blog/content/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/index.mdx b/apps/blog/content/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/index.mdx
index e199f1ac7a..eafa309fac 100644
--- a/apps/blog/content/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/index.mdx
+++ b/apps/blog/content/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/index.mdx
@@ -6,8 +6,10 @@ authors:
- "Nikolas Burk"
metaTitle: "Announcing: Prisma Postgres Integration for Vercel Marketplace"
metaDescription: "We’re thrilled to announce that you can now create and manage Prisma Postgres instances without leaving your Vercel Dashboard."
-metaImagePath: "/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/imgs/meta-1e5148009a4294ebba377f758ce1139e3c46bcef-1266x711.png"
-heroImagePath: "/blog/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/imgs/hero-b06562c14b921f9c72bd78bcd5b04717f20cf9e4-844x474.svg"
+metaImagePath: "/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/imgs/meta-1e5148009a4294ebba377f758ce1139e3c46bcef-1266x711.png"
+heroImagePath: "/connect-your-apps-to-prisma-postgres-via-vercel-marketplace-integration/imgs/hero-b06562c14b921f9c72bd78bcd5b04717f20cf9e4-844x474.svg"
+tags:
+ - "announcement"
excerpt: |
Prisma Postgres is the first serverless database without cold starts—and we’re thrilled to announce that you can now create and manage Prisma Postgres instances without leaving your Vercel Dashboard via our new [Vercel Marketplace integration](http://vercel.com/marketplace/prisma).
---
@@ -34,7 +36,7 @@ With the new Prisma Postgres integration, you can:
To get you started, we have built a [starter template](https://vercel.com/templates/next.js/prisma-postgres) for you that can deploy with a single-click.
-
+
The template uses the new Prisma Postgres integration, so that you can simply create a free Prisma Postgres instance during the deployment flow and your application immediately connects to a database once it's live!
diff --git a/apps/blog/content/blog/connections-edges-nodes-in-relay-758d358aa4c7/index.mdx b/apps/blog/content/blog/connections-edges-nodes-in-relay-758d358aa4c7/index.mdx
index fe8d27f139..79ec69a1a0 100644
--- a/apps/blog/content/blog/connections-edges-nodes-in-relay-758d358aa4c7/index.mdx
+++ b/apps/blog/content/blog/connections-edges-nodes-in-relay-758d358aa4c7/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Johannes Schickling"
- "Søren Bramer Schmidt"
metaTitle: "Learn more about Connections, Edges & Nodes in Relay | Prisma"
-metaImagePath: "/blog/connections-edges-nodes-in-relay-758d358aa4c7/imgs/meta-cc730c78d87244cb877764a6a4a850b2c9223871-1200x775.png"
-heroImagePath: "/blog/connections-edges-nodes-in-relay-758d358aa4c7/imgs/hero-a86c8de527177e03b9e08b9f1f1522dc1debbc6d-559x361.png"
+metaImagePath: "/connections-edges-nodes-in-relay-758d358aa4c7/imgs/meta-cc730c78d87244cb877764a6a4a850b2c9223871-1200x775.png"
+heroImagePath: "/connections-edges-nodes-in-relay-758d358aa4c7/imgs/hero-a86c8de527177e03b9e08b9f1f1522dc1debbc6d-559x361.png"
excerpt: |
The terminology of Relay can be quite overwhelming in the beginning. Relay introduces a handful of new concepts on top
of GraphQL, mainly in order to manage relationships between models..
@@ -51,7 +51,7 @@ Okay, let’s see what’s going on here. The `actors` connection now has a more
Don’t worry. In order to use Relay, you don’t have to understand the reasons why the structure is designed this way but rest assured that [it makes a lot of sense](https://relay.dev/graphql/connections.htm).
-
+
Lastly, we also notice the first: 10 parameter on the actors field. This gives us a way to [paginate](https://en.wikipedia.org/wiki/Pagination) over the entire list of related actors. In this case we’re taking the first 10 actors (nodes). In the same way we could additionally specify the after parameter which allows us to skip a certain amount of nodes.
diff --git a/apps/blog/content/blog/convergence/index.mdx b/apps/blog/content/blog/convergence/index.mdx
index 5866af2429..ddbbbd1663 100644
--- a/apps/blog/content/blog/convergence/index.mdx
+++ b/apps/blog/content/blog/convergence/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Nitin Gupta"
metaTitle: "The ORM Convergence: Convergence through experience"
metaDescription: "Why Drizzle's relational API v2 mirrors Prisma: production database problems at scale lead to similar patterns. A look at ORM convergence."
-metaImagePath: "/blog/convergence/imgs/meta-3963296cdd515c9ae5cb17379fcff0da144c7b35-1266x711.png"
-heroImagePath: "/blog/convergence/imgs/hero-532d75ec739a13ee528e8b2a085d47fc962a3ca7-840x472.png"
+metaImagePath: "/convergence/imgs/meta-3963296cdd515c9ae5cb17379fcff0da144c7b35-1266x711.png"
+heroImagePath: "/convergence/imgs/hero-532d75ec739a13ee528e8b2a085d47fc962a3ca7-840x472.png"
heroImageAlt: "ORM Convergence"
excerpt: |
Drizzle's relational API v2 adds migrations, object-based queries, and abstractions mirroring Prisma's architecture. Plot twist: this isn't copying, it's convergence. Production database problems at scale demand similar solutions. Seeing another team reach the same conclusions we did in 2020? Pretty validating.
diff --git a/apps/blog/content/blog/coo-announcement-aer1fgviirjb/index.mdx b/apps/blog/content/blog/coo-announcement-aer1fgviirjb/index.mdx
index 48c5b01a4a..fe98d6a174 100644
--- a/apps/blog/content/blog/coo-announcement-aer1fgviirjb/index.mdx
+++ b/apps/blog/content/blog/coo-announcement-aer1fgviirjb/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Søren Bramer Schmidt"
metaTitle: "Prisma Is Expanding Its Executive Team"
metaDescription: "Announcement about new COO joining Prisma"
-metaImagePath: "/blog/coo-announcement-aer1fgviirjb/imgs/hero-c79e2c7b7f4cd64f5be9677d4fab38140809b0f9-1267x711.png"
-heroImagePath: "/blog/coo-announcement-aer1fgviirjb/imgs/hero-c79e2c7b7f4cd64f5be9677d4fab38140809b0f9-1267x711.png"
+metaImagePath: "/coo-announcement-aer1fgviirjb/imgs/hero-c79e2c7b7f4cd64f5be9677d4fab38140809b0f9-1267x711.png"
+heroImagePath: "/coo-announcement-aer1fgviirjb/imgs/hero-c79e2c7b7f4cd64f5be9677d4fab38140809b0f9-1267x711.png"
heroImageAlt: "Prisma Is Expanding Its Executive Team"
+tags:
+ - "announcement"
excerpt: |
We are expanding our executive leadership team and are very excited to announce that Nitin Gupta joins us as COO.
diff --git a/apps/blog/content/blog/data-platform-static-ips/index.mdx b/apps/blog/content/blog/data-platform-static-ips/index.mdx
index 2475a85ce2..062b4e3976 100644
--- a/apps/blog/content/blog/data-platform-static-ips/index.mdx
+++ b/apps/blog/content/blog/data-platform-static-ips/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Daniel Norman"
metaTitle: "Enabling static egress IPs in the Prisma Data Platform"
metaDescription: "Static egress IP support ensures that the Prisma Data Platform connects to your databases through public static IP addresses helping you keep your database secure."
-metaImagePath: "/blog/data-platform-static-ips/imgs/meta-725058cd14e118302aa8e56bbaf31e46436bfc91-1269x640.png"
-heroImagePath: "/blog/data-platform-static-ips/imgs/hero-f9991a96b6b8ce0fa61dead528141fa1e8b911be-844x474.svg"
+metaImagePath: "/data-platform-static-ips/imgs/meta-725058cd14e118302aa8e56bbaf31e46436bfc91-1269x640.png"
+heroImagePath: "/data-platform-static-ips/imgs/hero-f9991a96b6b8ce0fa61dead528141fa1e8b911be-844x474.svg"
heroImageAlt: "Enabling static egress IPs in the Prisma Data Platform"
+tags:
+ - "announcement"
+ - "data-platform"
excerpt: |
We're launching Early Access support for static egress IPs. Keep your databases secure by ensuring that the Prisma
Data Platform only connects to your database from specific IPs. [Try it out](https://cloud.prisma.io/) and share your
@@ -76,13 +79,13 @@ You can enable static egress IPs per environment in both new and existing projec
You will be prompted with an option to enable static IPs when configuring an environment in the project creation flow:
-
+
#### For an existing environment
To enable static egress IPs, choose a project in the Data Platform, go to the environment settings, and enable static IPs:
-
+
[Learn more about the feature in the docs](https://www.prisma.io/docs/data-platform/static-ips)
diff --git a/apps/blog/content/blog/database-access-in-react-server-components-r2xgk9aztgdf/index.mdx b/apps/blog/content/blog/database-access-in-react-server-components-r2xgk9aztgdf/index.mdx
index e7d9b804c9..5f821a79c7 100644
--- a/apps/blog/content/blog/database-access-in-react-server-components-r2xgk9aztgdf/index.mdx
+++ b/apps/blog/content/blog/database-access-in-react-server-components-r2xgk9aztgdf/index.mdx
@@ -5,9 +5,11 @@ date: "2021-02-24"
authors:
- "Mahmoud Abdelwahab"
metaTitle: "Send Database Queries in a React App Using Server Components"
-metaImagePath: "/blog/database-access-in-react-server-components-r2xgk9aztgdf/imgs/meta-8befd7df92cc32135332ef9c28b41e076e2c8998-1251x630.png"
-heroImagePath: "/blog/database-access-in-react-server-components-r2xgk9aztgdf/imgs/hero-f388984fa1fe34f5d79d884f6f599c22a4107fa1-846x426.png"
+metaImagePath: "/database-access-in-react-server-components-r2xgk9aztgdf/imgs/meta-8befd7df92cc32135332ef9c28b41e076e2c8998-1251x630.png"
+heroImagePath: "/database-access-in-react-server-components-r2xgk9aztgdf/imgs/hero-f388984fa1fe34f5d79d884f6f599c22a4107fa1-846x426.png"
heroImageAlt: "Database Access in React Server Components"
+tags:
+ - "education"
excerpt: |
React Server Components were previewed near the end of 2020. In this article, we'll explore what they are, the problems they solve, and how we can use them for direct database access.
@@ -79,7 +81,7 @@ Which two do we pick? Let's take a look at three different examples.
Say we're building an app like Spotify, here's the mockup of what it should look like:
-
+
This page contains information about a single artist, such as their top tracks, discography, and details.
If we were to build this UI using React, we'd break it down into multiple components.
@@ -153,7 +155,7 @@ This approach is not fast because our parent component's children only start fet
So we end up having a waterfall of network requests, where network requests start one after the other, instead of all at once:
-
+
### Prioritizing speed and ease of maintenance
@@ -200,7 +202,7 @@ Also, since we now have access to the database, we can send queries directly fro
After being rendered on the server, Server Components are sent to the browser in a JSON like format, which can the be merged with the client's component tree without losing state. ([More details about the response format](https://github.com/josephsavona/rfcs/blob/server-components/text/0000-server-components.md#what-is-the-response-format)).
-
+
How is this different than server-side rendering (e.g. using Next.js)?
@@ -232,7 +234,7 @@ npm start
```
The app will be running at [http://localhost:4000](http://localhost:4000) and this is what you'll see:
-
+
### Project structure
diff --git a/apps/blog/content/blog/database-vs-application-demystifying-join-strategies/index.mdx b/apps/blog/content/blog/database-vs-application-demystifying-join-strategies/index.mdx
index a1bca032ee..c5c07fb693 100644
--- a/apps/blog/content/blog/database-vs-application-demystifying-join-strategies/index.mdx
+++ b/apps/blog/content/blog/database-vs-application-demystifying-join-strategies/index.mdx
@@ -5,8 +5,10 @@ date: "2025-01-15"
authors:
- "Nikolas Burk"
metaDescription: "Joining data from multiple tables is a complicated topic. There are two main strategies: database-level and application-level joins. Prisma ORM offers both options. In this article you’ll learn the tradeoffs between the two so you can pick the best strategy."
-metaImagePath: "/blog/database-vs-application-demystifying-join-strategies/imgs/meta-3dd1f6419862f57459fa70702fabf854946e6e13-1266x711.png"
-heroImagePath: "/blog/database-vs-application-demystifying-join-strategies/imgs/hero-5fa4fcf8d00bbf21e0b169f955a09f79332fb75b-844x474.svg"
+metaImagePath: "/database-vs-application-demystifying-join-strategies/imgs/meta-3dd1f6419862f57459fa70702fabf854946e6e13-1266x711.png"
+heroImagePath: "/database-vs-application-demystifying-join-strategies/imgs/hero-5fa4fcf8d00bbf21e0b169f955a09f79332fb75b-844x474.svg"
+tags:
+ - "education"
excerpt: |
Joining data from multiple tables is a complicated topic. There are two main strategies: database-level and application-level joins. [Prisma ORM offers both options](https://www.prisma.io/blog/prisma-orm-now-lets-you-choose-the-best-join-strategy-preview). In this article you’ll learn the tradeoffs between the two so you can pick the best strategy for your use case.
---
@@ -57,7 +59,7 @@ However, if you've worked with a SQL database before, you're probably aware that
Here's a visual representation of the two approaches:
-
+
This is a huge difference, not only in the way data is _physically_ laid out on disk and in memory, but also when it comes to the _mental model_ and to reasoning about the data.
@@ -154,7 +156,7 @@ ORDER BY
```
The results returned by the database may look similar to this:
-
+
Do you notice something? There's _a lot_ of repetition in the data on the `user_name` column.
@@ -179,7 +181,7 @@ ORDER BY
```
Now that's even worse! Not only `user_name` repeats, but `post_title` does so as well:
-
+
The redundancy of the data has several negative implications:
@@ -306,7 +308,7 @@ GROUP BY
```
Such a query produces the following results:
-
+
This data is similar to the one from the section about naive DB-level joins, except that:
diff --git a/apps/blog/content/blog/datadx-event-recap-z5pcp6hzbz5m/index.mdx b/apps/blog/content/blog/datadx-event-recap-z5pcp6hzbz5m/index.mdx
index e9d7754cb0..d84d55c2b5 100644
--- a/apps/blog/content/blog/datadx-event-recap-z5pcp6hzbz5m/index.mdx
+++ b/apps/blog/content/blog/datadx-event-recap-z5pcp6hzbz5m/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Petra Donka"
metaTitle: "Key takeaways from the Discover Data DX virtual event"
metaDescription: "Highlights from the Discover Data DX virtual event hosted by Prisma on December 7th, 2023, where industry leaders discussed the significance and principles of Data DX."
-metaImagePath: "/blog/datadx-event-recap-z5pcp6hzbz5m/imgs/meta-3155f43f9648d3e4eedd05759f69d6876b72d313-1265x711.png"
-heroImagePath: "/blog/datadx-event-recap-z5pcp6hzbz5m/imgs/hero-23097a272172cd3791887b9664ecd25e4dc65cff-843x474.svg"
+metaImagePath: "/datadx-event-recap-z5pcp6hzbz5m/imgs/meta-3155f43f9648d3e4eedd05759f69d6876b72d313-1265x711.png"
+heroImagePath: "/datadx-event-recap-z5pcp6hzbz5m/imgs/hero-23097a272172cd3791887b9664ecd25e4dc65cff-843x474.svg"
heroImageAlt: "Key takeaways from the Discover Data DX virtual event"
+tags:
+ - "announcement"
excerpt: |
Explore the insights from the [Discover Data DX virtual event](https://www.datadx.io/event) held on December 7th, 2023. The event brought together industry leaders to discuss the significance and principles of the emerging Data DX category.
diff --git a/apps/blog/content/blog/datadx-manifesto-ikgyqj170k8h/index.mdx b/apps/blog/content/blog/datadx-manifesto-ikgyqj170k8h/index.mdx
index 5f4d576d83..6a762d658e 100644
--- a/apps/blog/content/blog/datadx-manifesto-ikgyqj170k8h/index.mdx
+++ b/apps/blog/content/blog/datadx-manifesto-ikgyqj170k8h/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Nitin Gupta"
metaTitle: "Data DX Manifesto: a new era in data-driven app development"
metaDescription: "Prisma introduces Data DX (Data Developer Experience) as a fresh approach for effortlessly building data-driven applications."
-metaImagePath: "/blog/datadx-manifesto-ikgyqj170k8h/imgs/meta-96de5fd29833ae651da6ecc88c021bb9d84eba1b-1266x711.png"
-heroImagePath: "/blog/datadx-manifesto-ikgyqj170k8h/imgs/hero-2e402be560690da1dd594236284a8efa71a8f82f-844x474.svg"
+metaImagePath: "/datadx-manifesto-ikgyqj170k8h/imgs/meta-96de5fd29833ae651da6ecc88c021bb9d84eba1b-1266x711.png"
+heroImagePath: "/datadx-manifesto-ikgyqj170k8h/imgs/hero-2e402be560690da1dd594236284a8efa71a8f82f-844x474.svg"
heroImageAlt: "Data DX"
+tags:
+ - "announcement"
excerpt: |
Prisma presents the [Data DX manifesto](https://datadx.io), a transformative approach to data-driven app development. More than a document, it is a call to action. The manifesto highlights the benefits of Data DX for developers and offers insights for innovative product creation.
diff --git a/apps/blog/content/blog/datadx-name-for-prismas-philosophy/index.mdx b/apps/blog/content/blog/datadx-name-for-prismas-philosophy/index.mdx
index f4c3a33c0c..eee834e2a1 100644
--- a/apps/blog/content/blog/datadx-name-for-prismas-philosophy/index.mdx
+++ b/apps/blog/content/blog/datadx-name-for-prismas-philosophy/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Dave Feldman"
metaTitle: "Data DX: The name for Prisma’s developer experience philosophy"
metaDescription: "Explore the evolution of Data DX at Prisma, from its inception before naming to the launch of a new category."
-metaImagePath: "/blog/datadx-name-for-prismas-philosophy/imgs/meta-20adaa4799629b59c11ad00ea86bdc7cfbbd0ed5-1266x711.png"
-heroImagePath: "/blog/datadx-name-for-prismas-philosophy/imgs/hero-6b87cc279c810d8c9af92e0bfc3e4a4b21dd9bf0-844x474.svg"
+metaImagePath: "/datadx-name-for-prismas-philosophy/imgs/meta-20adaa4799629b59c11ad00ea86bdc7cfbbd0ed5-1266x711.png"
+heroImagePath: "/datadx-name-for-prismas-philosophy/imgs/hero-6b87cc279c810d8c9af92e0bfc3e4a4b21dd9bf0-844x474.svg"
excerpt: |
Explore the evolution of [Data DX](https://www.datadx.io/) at Prisma, from its inception before naming to the launch of a new category. Learn more about our founder’s vision and how Data DX is integrated into Prisma's products, and join the industry-wide shift towards a new era in developer experience.
---
diff --git a/apps/blog/content/blog/datamodel-v11-lrzqy1f56c90/index.mdx b/apps/blog/content/blog/datamodel-v11-lrzqy1f56c90/index.mdx
index 3c53ad7247..18ed2fe9bb 100644
--- a/apps/blog/content/blog/datamodel-v11-lrzqy1f56c90/index.mdx
+++ b/apps/blog/content/blog/datamodel-v11-lrzqy1f56c90/index.mdx
@@ -5,8 +5,8 @@ date: "2019-04-17"
authors:
- "Nikolas Burk"
metaTitle: "New Datamodel Syntax: Improved Schema Control & Simpler Migrations"
-metaImagePath: "/blog/datamodel-v11-lrzqy1f56c90/imgs/hero-99f1530d6ebe62110fd2839ba4f0185795ee5db4-1200x630.png"
-heroImagePath: "/blog/datamodel-v11-lrzqy1f56c90/imgs/hero-99f1530d6ebe62110fd2839ba4f0185795ee5db4-1200x630.png"
+metaImagePath: "/datamodel-v11-lrzqy1f56c90/imgs/hero-99f1530d6ebe62110fd2839ba4f0185795ee5db4-1200x630.png"
+heroImagePath: "/datamodel-v11-lrzqy1f56c90/imgs/hero-99f1530d6ebe62110fd2839ba4f0185795ee5db4-1200x630.png"
heroImageAlt: "New Datamodel Syntax: More Schema Control & Simpler Migration"
excerpt: |
Prisma's latest release features an improved datamodel syntax. It removes many of the opinionated decisions Prisma used to make about the database layout and enables more control for developers.
@@ -578,7 +578,7 @@ From here on, you can use the [Prisma client](https://v1.prisma.io/docs/1.31/pri
To access your data in [Prisma Admin](https://v1.prisma.io/docs/1.31/prisma-admin), you need to navigate to the Admin endpoint of your Prisma project: `http://localhost:4466/_admin`
-
+
---
diff --git a/apps/blog/content/blog/documenting-apis-mjjpz7e7nkvp/index.mdx b/apps/blog/content/blog/documenting-apis-mjjpz7e7nkvp/index.mdx
index fdc89f8d62..5c38f297e9 100644
--- a/apps/blog/content/blog/documenting-apis-mjjpz7e7nkvp/index.mdx
+++ b/apps/blog/content/blog/documenting-apis-mjjpz7e7nkvp/index.mdx
@@ -5,9 +5,11 @@ date: "2021-05-06"
authors:
- "Alex Ruheni"
metaTitle: "Learn 5 Tools for Documenting Web APIs"
-metaImagePath: "/blog/documenting-apis-mjjpz7e7nkvp/imgs/hero-2982f7850de70f0c52daa613dae904b463342823-1692x852.png"
-heroImagePath: "/blog/documenting-apis-mjjpz7e7nkvp/imgs/hero-2982f7850de70f0c52daa613dae904b463342823-1692x852.png"
+metaImagePath: "/documenting-apis-mjjpz7e7nkvp/imgs/hero-2982f7850de70f0c52daa613dae904b463342823-1692x852.png"
+heroImagePath: "/documenting-apis-mjjpz7e7nkvp/imgs/hero-2982f7850de70f0c52daa613dae904b463342823-1692x852.png"
heroImageAlt: "5 Tools for Documenting Your Web API"
+tags:
+ - "education"
excerpt: |
Learn the importance of documenting web APIs, the different approaches available, and the tools you can leverage to document web APIs.
@@ -141,7 +143,7 @@ npm run dev
```
When the application is running, open your browser and navigate to http://localhost:3000/api, and you should see the following:
-
+
The `@nestjs/swagger` module makes use of the decorators that define API requests to generate the Swagger documentation.
@@ -156,7 +158,7 @@ Once you hit publish, Postman generates documentation based on the collection.
For this example, you can refer to [this collection](https://documenter.getpostman.com/view/6036481/TzJpifja) containing the requests for the REST API-based Prisma examples.
You can import the collection on Postman and try it out for yourself from [here](https://raw.githubusercontent.com/prisma/prisma-examples/latest/.github/tests/postman_collections/rest.json).
-
+
You can enforce type-safety in this workflow by converting the JSON-formatted responses into TypeScript interfaces for the front-end applications using a tool like [JSON2Ts](http://www.json2ts.com//).
@@ -215,7 +217,7 @@ npm run dev
When the application is running, open your browser and navigate to http://localhost:4000 to explore the API.
Expand the **Docs** section on the GraphQL Playground. The generated schema would contain the comment under the Post field:
-
+
### Protocol buffers
diff --git a/apps/blog/content/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/index.mdx b/apps/blog/content/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/index.mdx
index 6b8ee61bbd..a3cdd1d35b 100644
--- a/apps/blog/content/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/index.mdx
+++ b/apps/blog/content/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/index.mdx
@@ -6,13 +6,14 @@ authors:
- "Sabin Adams"
metaTitle: "End-To-End Type-Safety with GraphQL, Prisma & React: Frontend"
metaDescription: "Learn how to build a fully type-safe application with GraphQL, Prisma, and React. This article walks you through building a type-safe React app that accesses a GraphQL API."
-metaImagePath: "/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/imgs/meta-dc0f147b1428391e4b3d0374523d45639d1318a6-1269x715.png"
-heroImagePath: "/blog/e2e-type-safety-graphql-react-1-i2gxifxksz/imgs/hero-2f58c7e9701e7f9a0250db211bdf5284da11d2d8-844x474.svg"
+metaImagePath: "/e2e-type-safety-graphql-react-1-i2gxifxksz/imgs/meta-dc0f147b1428391e4b3d0374523d45639d1318a6-1269x715.png"
+heroImagePath: "/e2e-type-safety-graphql-react-1-i2gxifxksz/imgs/hero-2f58c7e9701e7f9a0250db211bdf5284da11d2d8-844x474.svg"
heroImageAlt: "hero image prisma"
series:
title: "Build a Fully Type-Safe Application with GraphQL, Prisma & React"
- slug: "e2e-typesafety-graphql-react-yiw81oBkun"
seriesIndex: 1
+tags:
+ - "education"
excerpt: |
13 min read
@@ -103,11 +104,11 @@ npm run dev
```
Once your development server is up and running you should see some output that looks similar to this:
-
+
If you pop open the link from that output you will be presented with Vite's React and TypeScript template landing template page:
-
+
## Clean up the template
@@ -188,7 +189,7 @@ TailwindCSS is now configured and ready to go! Replace the existing `` tag i
```
If your webpage looks like this, congrats! You've successfully set up TailwindCSS!
-
+
> **Note**: If not, try restarting your development server and ensure the steps above were followed correctly.
@@ -363,7 +364,7 @@ export default App
```
If you head back to your browser you should see a nice box displaying your user's name! The only thing missing at this point is the user's messages.
-
+
## Display each user's messages
@@ -434,7 +435,7 @@ function UserDisplay({ user }: Props) {
```
Over in your browser, you should now see each user's messages to their right!
-
+
That looks great, however there is one last thing to add. You are building a tree view, so the final piece is to render "branches" that connect each message to its user.
@@ -498,7 +499,7 @@ export default MessageDisplay
```
Back over in your browser, you will now see branches for each message! Hover over a message to highlight the branch ✨
-
+
## Summary & What's next
diff --git a/apps/blog/content/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/index.mdx b/apps/blog/content/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/index.mdx
index e394db7e6d..e59fdb59bd 100644
--- a/apps/blog/content/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/index.mdx
+++ b/apps/blog/content/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/index.mdx
@@ -6,13 +6,14 @@ authors:
- "Sabin Adams"
metaTitle: "End-To-End Type-Safety with GraphQL, Prisma & React: API Prep"
metaDescription: "Learn how to build a fully type-safe application with GraphQL, Prisma, and React. This article walks you through setting up a TypeScript project, a PostgreSQL database, and Prisma."
-metaImagePath: "/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/imgs/meta-06962f83ac8be93c511d0ef6cbc29e2cff49e387-1269x715.png"
-heroImagePath: "/blog/e2e-type-safety-graphql-react-2-j9meyhy0ej/imgs/hero-838c88ca3817165045cc051d8845880e5a313baf-844x474.svg"
+metaImagePath: "/e2e-type-safety-graphql-react-2-j9meyhy0ej/imgs/meta-06962f83ac8be93c511d0ef6cbc29e2cff49e387-1269x715.png"
+heroImagePath: "/e2e-type-safety-graphql-react-2-j9meyhy0ej/imgs/hero-838c88ca3817165045cc051d8845880e5a313baf-844x474.svg"
heroImageAlt: "hero image prisma"
series:
title: "Build a Fully Type-Safe Application with GraphQL, Prisma & React"
- slug: "e2e-typesafety-graphql-react-yiw81oBkun"
seriesIndex: 2
+tags:
+ - "education"
excerpt: |
10 min read
@@ -53,7 +54,7 @@ In the process, you will set up an important piece of the end-to-end type-safety
-If you missed the [first part](/blog/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
+If you missed the [first part](/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
### Technologies you will use
@@ -160,7 +161,7 @@ You can now use the following command to run your code:
```shell
npm run dev
```
-
+
## Set up the database
@@ -171,21 +172,21 @@ Head over to [https://railway.app](https://railway.app) and, if you don't alread
After creating an account and logging in, you should see a page like this:
-
+
Hit the **New Project** button, or simply click the **Create a New Project** area.
You will be presented with a search box and a few common options. Select the **Provision PostgreSQL** option.
-
+
The option selected above creates a new PostgreSQL database and deploys it. Once the server is ready, you should see your provisioned database on the screen. Click the **PostgreSQL** instance.
-
+
That will open up a menu with a few different tabs. On the **Connect** tab, you will find your database's connection string. Take note of where to find this string as you will need them in just a little while.
-
+
## Set up Prisma
@@ -311,7 +312,7 @@ The above command will create a new migration file named `init`, apply that migr
If you head back over to the Railway UI, in the **Data** tab you should see your tables listed. If so, the migration worked and your database is ready to be put to work!
-
+
### Seed the database 🌱
@@ -408,7 +409,7 @@ npx prisma db seed
```
After running the script, if you head back to the Railway UI and into the **Data** tab, you should be able to navigate through the newly added data.
-
+
## Summary & What's next
diff --git a/apps/blog/content/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/index.mdx b/apps/blog/content/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/index.mdx
index 502da215ea..34a3057611 100644
--- a/apps/blog/content/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/index.mdx
+++ b/apps/blog/content/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/index.mdx
@@ -6,13 +6,14 @@ authors:
- "Sabin Adams"
metaTitle: "End-To-End Type-Safety with GraphQL, Prisma & React: GraphQL API"
metaDescription: "Learn how to build a fully type-safe application with GraphQL, Prisma, and React. This article walks you through building a type-safe GraphQL API"
-metaImagePath: "/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/imgs/meta-c8b654f7165277e7cf2cfde5311381d601463251-1269x715.png"
-heroImagePath: "/blog/e2e-type-safety-graphql-react-3-fbv2zvigwg/imgs/hero-78bb7b87f2bf7e691114b2768df5ddfe12e00934-844x474.svg"
+metaImagePath: "/e2e-type-safety-graphql-react-3-fbv2zvigwg/imgs/meta-c8b654f7165277e7cf2cfde5311381d601463251-1269x715.png"
+heroImagePath: "/e2e-type-safety-graphql-react-3-fbv2zvigwg/imgs/hero-78bb7b87f2bf7e691114b2768df5ddfe12e00934-844x474.svg"
heroImageAlt: "hero image prisma"
series:
title: "Build a Fully Type-Safe Application with GraphQL, Prisma & React"
- slug: "e2e-typesafety-graphql-react-yiw81oBkun"
seriesIndex: 3
+tags:
+ - "education"
excerpt: |
14 min read
@@ -47,7 +48,7 @@ While building this API, you will focus on ensuring your interactions with the d
-If you missed the [first part](/blog/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
+If you missed the [first part](/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
### Technologies you will use
@@ -121,7 +122,7 @@ If you start up your server, you will have access to a running _(empty)_ GraphQL
```shell
npm run dev
```
-
+
> **Note**: The GraphQL server is up and running, however it is not usable because you have not yet defined any queries or mutations.
@@ -266,7 +267,7 @@ npm run build
```
When you run the command above, you should see that Prisma Client and the Pothos integration were both generated.
-
+
Now that those types are generated, head over to `src/builder.ts`. Here you will import the `PrismaPlugin` and the generated Pothos types and apply them to your builder:
@@ -289,7 +290,7 @@ builder.addScalarType("Date", DateResolver, {});
```
As soon as you add the generated types, you will notice a TypeScript error occur within the instantiation of the `SchemaBuilder`.
-
+
Pothos is smart enough to know that, because you are using the Prisma plugin, you need to provide a `prisma` instance to the builder. This is used by Pothos to infer information about the types in your Prisma Client. In the next step you will create and add that instance to the builder.
@@ -313,7 +314,7 @@ export const builder = new SchemaBuilder<{
```
You will, again, see a TypeScript error at this point. This is because the `builder` now expects an instance of Prisma Client to be provided to the function.
-
+
In the next step, you will instantiate Prisma Client and provide it here in the `builder`.
@@ -402,7 +403,7 @@ import { builder } from "../builder";
+builder.prismaObject("User", {})
```
> **Note**: If you press Ctrl + Space within an empty set of quotes before typing in the `name` field, you should get some nice auto-completion with a list of available models from your Prisma schema thanks to the Prisma plugin.
-> 
+> 
Within the `options` object, add a `fields` key that defines the `id`, `name` and `messages` fields using Pothos's ["expose"](https://pothos-graphql.dev/docs/guide/fields#exposing-fields-from-the-underlying-data) functions:
@@ -847,17 +848,17 @@ npm run dev
```
After running the above command, open up [http://localhost:4000/graphql](http://localhost:4000/graphql) in your browser to access the GraphQL playground. You should be presented with a page that looks like this:
-
+
In the top-left corner of the screen, hit the **Explorer** button to see your API's available queries and mutations:
-
+
If you click on the **users** query type, the right side of the screen will be automatically populated with a query for your user data.
Run that query by hitting the "execute query" button to see the API in action:
-
+
Feel free to play around with the different options to choose which fields you would like to query for and which data from the "messages" relation you would like to include.
diff --git a/apps/blog/content/blog/e2e-type-safety-graphql-react-4-jaha8gbker/index.mdx b/apps/blog/content/blog/e2e-type-safety-graphql-react-4-jaha8gbker/index.mdx
index a74a6f9912..e3086caea3 100644
--- a/apps/blog/content/blog/e2e-type-safety-graphql-react-4-jaha8gbker/index.mdx
+++ b/apps/blog/content/blog/e2e-type-safety-graphql-react-4-jaha8gbker/index.mdx
@@ -6,13 +6,14 @@ authors:
- "Sabin Adams"
metaTitle: "End-To-End Type-Safety with GraphQL, Prisma & React: Codegen & Deployment"
metaDescription: "Learn how to build a fully type-safe application with GraphQL, Prisma, and React. This article walks you through setting up code generation to allow you to keep your TypeScript types in sync across your frontend and API. You will also deploy your completed project."
-metaImagePath: "/blog/e2e-type-safety-graphql-react-4-jaha8gbker/imgs/meta-42c1cab53d152b8e3e634d75bc70b9d624431cf7-1269x715.png"
-heroImagePath: "/blog/e2e-type-safety-graphql-react-4-jaha8gbker/imgs/hero-b277fdcfbb2267b2f5a9b5d2bd7f06e053febf0f-844x474.svg"
+metaImagePath: "/e2e-type-safety-graphql-react-4-jaha8gbker/imgs/meta-42c1cab53d152b8e3e634d75bc70b9d624431cf7-1269x715.png"
+heroImagePath: "/e2e-type-safety-graphql-react-4-jaha8gbker/imgs/hero-b277fdcfbb2267b2f5a9b5d2bd7f06e053febf0f-844x474.svg"
heroImageAlt: "hero image prisma"
series:
title: "Build a Fully Type-Safe Application with GraphQL, Prisma & React"
- slug: "e2e-typesafety-graphql-react-yiw81oBkun"
seriesIndex: 4
+tags:
+ - "education"
excerpt: |
16 min read
@@ -46,7 +47,7 @@ In this final section of the series, you will set up the final piece of the end-
-If you missed the [first part](/blog/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
+If you missed the [first part](/e2e-type-safety-graphql-react-1-I2GxIfxkSZ) of this series, here is a quick overview of the technologies you will be using in this application, as well as a few prerequisites.
### Technologies you will use
@@ -85,17 +86,17 @@ To follow along with the examples provided, you will be expected to have:
Currently, Prisma generates a set of TypeScript types based off of your database schema. Pothos uses those types to help build GraphQL type definitions. The result of those two pieces is a GraphQL schema:
-
+
Your frontend project currently has a set of manually defined types, which were built in the first section of this series. These are "compatible with" the types in your API, but not directly related:
-
+
Until now, this worked fine. But what happens if a new field is introduced, updated, or removed form the API? Your frontend application would have no idea a change occurred in the API and the type definitions in the two projects would become out of sync.
How can you be sure a `user` object you retrieve over the network, for example, will contain all of the fields your React application is expecting? This is where [GraphQL Codegen](https://www.graphql-code-generator.com/) comes in:
-
+
GraphQL Codegen will generate TypeScript types and query helpers in your React project based off of your GraphQL schema and the queries you write in your frontend application.
@@ -217,7 +218,7 @@ npm run codegen
```
You should see output similar to this:
-
+
As configured in your `codegen.yml` file, you will find a new file in `src/graphql` named `generated.ts`.
@@ -339,7 +340,7 @@ export type User = GetUsersQuery["users"][0];
```
If you head over to `src/components/UserDisplay.tsx` and inspect the type being used for the `user` prop, you will now see it uses the type generated from your GraphQL query and API:
-
+
You now have almost every piece of the end-to-end type-safety puzzle put in place. Your types are in sync from your database all the way to your frontend application.
@@ -467,7 +468,7 @@ export default App
```
Notice your API request results are properly typed based off of the types within the API itself! If both your API and Client are running, head over to the browser. You should now see all of your data!
-
+
Congrats! 🎉 At this point, you have implemented a completely end-to-end type safe application with two separate pieces: an API and the client.
@@ -481,15 +482,15 @@ You will be using [Render](https://render.com/) to deploy both of your codebases
In the top left corner of the home page, hit the **New** button to create a new repository:
-
+
Give your repository a name and then hit **Create repository**:
-
+
You will need to retrieve the SSH url for this repository to use later on. Grab that from the location shown below:
-
+
Now within your React application, run the follwing command to initialize and push a local repository, replacing `` with the SSH url:
@@ -516,15 +517,15 @@ git push -u origin main
Next, you will repeat these steps for your API's codebase.
Create another new repository from your Github dashboard:
-
+
Title the repository and hit **Create repository**:
-
+
You should again see a page with some setup instructions. Grab the SSH url from the same location as before:
-
+
Finally, navigate via the terminal into your GraphQL API's codebase and run the following set of commands. Again, replace `` with your SSH url:
@@ -556,11 +557,11 @@ Head over to [Render](https://render.com) and create a free account if you do no
The first thing you will deploy is your GraphQL API. On your dashboard, hit the **New Web Service** button, which will allow you to deploy a Node.js application:
-
+
On this page, if you haven't already, click **+ Connect account** under the **Github** header to give Render access to list your Github repositories:
-
+
After connecting your account, you should see your repositories available under the **Connect a repository** header. Choose your GraphQL API repository.
@@ -575,24 +576,24 @@ You will be prompted for a few different options:
Beneath those options, choose the **Free** plan:
-
+
Expand the **Advanced** section near the bottom of the page. Here you will define an environment variable that will hold your database URL.
Click the **Add Environment Variable** button and add a variable named `DATABASE_URL` whose value is the connection string to your Postgres database:
-
+
Finally, at the bottom of the page, hit the **Create Web Service** button:
-
+
This will trigger the deployment process! Once that finishes deploying, you will be able to access the URL Render provides to see your GraphQL API.
Copy the URL from the location shown below and navigate to it in a new browser window at the `/graphql` route:
-
+
## Deploy the React application
@@ -600,7 +601,7 @@ Now that your API is deployed, you will deploy your React application.
Head back over to the Render dashboard and hit the **New** button at the top of the page. Choose the **Static Site** option:
-
+
Connect this static site to your React application's Github repostory.
@@ -613,13 +614,13 @@ You will be prompted again to fill out some details for deploying this applicati
Under the **Advanced** section, add an environment variable named `VITE_API_URL` whose value is the URL of your deployed GraphQL API at the `/graphql` route. For example:
-
+
Finally, hit the **Create Static Site** button at the bottom of the page to deploy the application.
When that finishes deploying, head over to the URL available at the top of the page. If all went well, you should see your application is live!
-
+
## Summary & Final thoughts
diff --git a/apps/blog/content/blog/elsevier-customer-story-ssaaskagmhtn/index.mdx b/apps/blog/content/blog/elsevier-customer-story-ssaaskagmhtn/index.mdx
index 0201aaebd5..53b860dc96 100644
--- a/apps/blog/content/blog/elsevier-customer-story-ssaaskagmhtn/index.mdx
+++ b/apps/blog/content/blog/elsevier-customer-story-ssaaskagmhtn/index.mdx
@@ -6,9 +6,11 @@ authors:
- "Alex Emerich"
metaTitle: "How Elsevier piloted an innovative publication process with Prisma"
metaDescription: "Elsevier is a global leader in information and analytics in scientific publishing. Learn how they modernized the publication process efficiently and flexibly with Prisma."
-metaImagePath: "/blog/elsevier-customer-story-ssaaskagmhtn/imgs/hero-4eaa561121a703742d0016b7a60b69e0cc262dc8-1692x852.png"
-heroImagePath: "/blog/elsevier-customer-story-ssaaskagmhtn/imgs/hero-4eaa561121a703742d0016b7a60b69e0cc262dc8-1692x852.png"
+metaImagePath: "/elsevier-customer-story-ssaaskagmhtn/imgs/hero-4eaa561121a703742d0016b7a60b69e0cc262dc8-1692x852.png"
+heroImagePath: "/elsevier-customer-story-ssaaskagmhtn/imgs/hero-4eaa561121a703742d0016b7a60b69e0cc262dc8-1692x852.png"
heroImageAlt: "Elsevier"
+tags:
+ - "usersuccessstory"
excerpt: |
Elsevier is a global leader in information and analytics in scientific publishing, and helps researchers and healthcare professionals advance science and improve health outcomes for the benefit of society.
@@ -22,7 +24,7 @@ excerpt: |
[Elsevier's](https://www.elsevier.com/) mission of helping researchers and healthcare professionals is rooted in publishing and has also evolved into a global leader in information and analytics. With so much health-related information being shared in real time, Elsevier decided it was time to modernize and speed up their existing manual peer review process.
-
+
Building an application to speed up the peer review process would help Elsevier remain a leader in healthcare research. They dedicated a small project team consisting of Serghei Ghidora (Tech Lead), Paul Foeckler (Product Owner), and a UX Designer to develop a minimum viable product (MVP) to make the peer review process faster and more efficient.
@@ -116,7 +118,7 @@ The flexibility proved to be a major contributor to a single tech lead producing
In addition to Prisma, Serghei utilized several other technologies to achieve their MVP. The project structure looks like the following, with Prisma serving types to multiple apps.
-
+
The **Prisma & Nexus** package includes the Prisma schema, migrations and all the generated types that are used across all apps and services. The lambdas import the Prisma client and update resources directly. This arrangement keeps the database and frontend types in sync because of Prisma Client's type-safe database access.
diff --git a/apps/blog/content/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/index.mdx b/apps/blog/content/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/index.mdx
index 743e957546..0153733f8f 100644
--- a/apps/blog/content/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/index.mdx
+++ b/apps/blog/content/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/index.mdx
@@ -5,8 +5,8 @@ date: "2017-11-22"
authors:
- "Nikolas Burk"
metaTitle: "Enabling CORS for Express-GraphQL & Apollo Server | Prisma"
-metaImagePath: "/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/hero-88be8d72c611e06bf0170f1e0416f589d50262dd-720x481.jpg"
-heroImagePath: "/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/hero-88be8d72c611e06bf0170f1e0416f589d50262dd-720x481.jpg"
+metaImagePath: "/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/hero-88be8d72c611e06bf0170f1e0416f589d50262dd-720x481.jpg"
+heroImagePath: "/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/hero-88be8d72c611e06bf0170f1e0416f589d50262dd-720x481.jpg"
heroImageAlt: "Enabling CORS for Express-GraphQL & Apollo Server"
excerpt: |
Learn how to configure cross-origin resource sharing on your express-based GraphQL servers.
@@ -126,21 +126,21 @@ export default graphql(
In your local development setup, where the React app is loaded from [`http://localhost:3000`](http://localhost:3000) and the GraphQL server is serving at [`http://localhost:4000`](http://localhost:4000)/graphql, you’ll now get an access control error if you’re trying to run the app:
-
+
What exactly is the issue when CORS is not enabled? Well, CORS is in fact a _specification_ for a communication flow between client (a browser) and server. In some situations, this flow requires the server to process HTTP [OPTIONS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/OPTIONS) requests as can be seen from this flowchart:
- method ([source](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#/media/File:Flowchart_showing_Simple_and_Preflight_XHR.svg))](/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/1*m6QGz5tXtLt7uVapNCpBEw.png)_The CORS flow might required additional HTTP requests with the [OPTIONS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/OPTIONS.png) method ([source](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#/media/File:Flowchart_showing_Simple_and_Preflight_XHR.svg))_
+ method ([source](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#/media/File:Flowchart_showing_Simple_and_Preflight_XHR.svg))](/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/1*m6QGz5tXtLt7uVapNCpBEw.png)_The CORS flow might required additional HTTP requests with the [OPTIONS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/OPTIONS.png) method ([source](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#/media/File:Flowchart_showing_Simple_and_Preflight_XHR.svg))_
The problem is that neither `express-graphql` nor `apollo-server` accept HTTP requests other than GET and POST — which is why the request fails in our scenario. This is also indicated by the error message we saw in the console: `OPTIONS [http://localhost:4000](http://localhost:4000) 405 (Method not allowed)`.
> [Here](https://github.com/graphql/express-graphql/issues/14) is the GitHub discussion on `express-graphql` where this issue first came up**.**
-Luckily, the solution is very simple. As `express-graphql` and `apollo-server` are both based on [express.js](https://github.com/expressjs), you can simply use its standard [cors](/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/cors#configuration-options) middleware to fix the issue.
+Luckily, the solution is very simple. As `express-graphql` and `apollo-server` are both based on [express.js](https://github.com/expressjs), you can simply use its standard [cors](/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/cors#configuration-options) middleware to fix the issue.
Uncommenting [line 23](https://github.com/nikolasburk/graphql-cors-example/blob/master/server/index.js#L23) in `server.js` will enable the cors middleware for your express server: `app.use(cors())`. Having the middleware enabled ensures your express server sets the proper HTTP header, enabling your React app to load data from it:
- middleware, the server sets the correct HTTP header enabling cross-origin resource sharing](/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/1*LnVsDQuQtSl-Wt-m6DfO5g.png)_Using the [cors](https://github.com/expressjs/cors) middleware, the server sets the correct HTTP header enabling cross-origin resource sharing_
+ middleware, the server sets the correct HTTP header enabling cross-origin resource sharing](/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d/imgs/1*LnVsDQuQtSl-Wt-m6DfO5g.png)_Using the [cors](https://github.com/expressjs/cors) middleware, the server sets the correct HTTP header enabling cross-origin resource sharing_
## Summary
diff --git a/apps/blog/content/blog/esop-exercise-windows/index.mdx b/apps/blog/content/blog/esop-exercise-windows/index.mdx
index 6983bb0eb3..848f75efd8 100644
--- a/apps/blog/content/blog/esop-exercise-windows/index.mdx
+++ b/apps/blog/content/blog/esop-exercise-windows/index.mdx
@@ -6,8 +6,8 @@ authors:
- "Martin Janse van Rensburg"
metaTitle: "Prisma | A Business Case for Extended ESOP Exercise Windows"
metaDescription: "Explore extending ESOPs to 10 years, considering fairness, economics, benefits, challenges with Prisma's example, and startup compensation."
-metaImagePath: "/blog/esop-exercise-windows/imgs/meta-da1df6bc6f7afc4cf8f1620698c60d0c2a6cd768-1200x630.png"
-heroImagePath: "/blog/esop-exercise-windows/imgs/hero-187cb6c0e9ac7a4c48892a3e196329e955984278-844x474.svg"
+metaImagePath: "/esop-exercise-windows/imgs/meta-da1df6bc6f7afc4cf8f1620698c60d0c2a6cd768-1200x630.png"
+heroImagePath: "/esop-exercise-windows/imgs/hero-187cb6c0e9ac7a4c48892a3e196329e955984278-844x474.svg"
heroImageAlt: "Extended ESOP Exercise Windows"
excerpt: |
As a progressive OSS SaaS company, we are expanding our commitment to transparency by sharing insights into our operational practices, starting with our approach to stock options.
diff --git a/apps/blog/content/blog/formbricks-and-prisma-accelerate-solving-scalability-together/index.mdx b/apps/blog/content/blog/formbricks-and-prisma-accelerate-solving-scalability-together/index.mdx
index 1bee04093f..60a3a3f154 100644
--- a/apps/blog/content/blog/formbricks-and-prisma-accelerate-solving-scalability-together/index.mdx
+++ b/apps/blog/content/blog/formbricks-and-prisma-accelerate-solving-scalability-together/index.mdx
@@ -6,9 +6,12 @@ authors:
- "Marc Hess"
metaTitle: "Formbricks' success story: Enhancing scalability with Prisma Accelerate"
metaDescription: "Learn how Formbricks tackled performance bottlenecks and enhanced server performance and user experience with Prisma Accelerate."
-metaImagePath: "/blog/formbricks-and-prisma-accelerate-solving-scalability-together/imgs/meta-e5f44f24630fabc28fd03092a220f9ad09fccc84-1800x945.png"
-heroImagePath: "/blog/formbricks-and-prisma-accelerate-solving-scalability-together/imgs/hero-2dedf610e6c3e1bfd7d7d262e086c9ced48412fa-804x474.svg"
+metaImagePath: "/formbricks-and-prisma-accelerate-solving-scalability-together/imgs/meta-e5f44f24630fabc28fd03092a220f9ad09fccc84-1800x945.png"
+heroImagePath: "/formbricks-and-prisma-accelerate-solving-scalability-together/imgs/hero-2dedf610e6c3e1bfd7d7d262e086c9ced48412fa-804x474.svg"
heroImageAlt: "Prisma Accelerate Logo and Formbricks Logo"
+tags:
+ - "data-platform"
+ - "usersuccessstory"
excerpt: |
Explore Formbricks' journey, an open-source survey platform, as they effectively tackled scalability challenges with [Prisma Accelerate](https://www.prisma.io/data-platform/accelerate?utm_source=blog&utm_medium=customer-story-formbricks). Learn how they strategically integrated it to manage growing user demands and maintained high performance.
---
@@ -17,7 +20,7 @@ excerpt: |
Formbricks began with a clear vision: to provide a free, open-source surveying platform that empowers businesses to gather feedback seamlessly at every point in the user journey. From in-app and website surveys to link and email questionnaires, Formbricks offers a comprehensive suite of tools designed for beautiful, effective user engagement.
-
+
Formbricks isn't just about collecting data; it's about crafting exceptional user experiences. With its privacy-first approach, Formbricks stands as both a survey platform and an experience management powerhouse. Users can leverage the Formbricks Insight Platform for prebuilt data analysis capabilities or build upon it to create tailored solutions.
diff --git a/apps/blog/content/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/index.mdx b/apps/blog/content/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/index.mdx
index 0a84d4dbe3..fb45af9b99 100644
--- a/apps/blog/content/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/index.mdx
+++ b/apps/blog/content/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/index.mdx
@@ -6,12 +6,11 @@ authors:
- "Jon Harrell"
metaTitle: "Prisma ORM Architecture Shift: Why We Moved from Rust to TypeScript"
metaDescription: "Why is Prisma ORM switching from Rust to TypeScript? Read the full architectural rationale and what the new Query Compiler means for your app's speed"
-metaImagePath: "/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/imgs/meta-ded124ddfa8412b0d678ab94a9804127188fde00-1266x711.png"
-heroImagePath: "/blog/from-rust-to-typescript-a-new-chapter-for-prisma-orm/imgs/hero-0f2a3395d4395fe407ce7fb6b603bb7c5ff3e460-844x474.svg"
+metaImagePath: "/from-rust-to-typescript-a-new-chapter-for-prisma-orm/imgs/meta-ded124ddfa8412b0d678ab94a9804127188fde00-1266x711.png"
+heroImagePath: "/from-rust-to-typescript-a-new-chapter-for-prisma-orm/imgs/hero-0f2a3395d4395fe407ce7fb6b603bb7c5ff3e460-844x474.svg"
heroImageAlt: "Prisma ORM Architecture Shift: Why We Moved from Rust to TypeScript"
series:
title: "Prisma ORM: The Complete Rust-to-TypeScript Migration Journey"
- slug: "prisma-orm-the-complete-rust-to-typescript-migration-journey"
seriesIndex: 1
excerpt: |
The Prisma query engine, written in Rust, has always been a core part of Prisma ORM. It was developed for the future, but is no longer compatible with Prisma ORM’s current direction. Read on to learn more about our rewrite from Rust to TypeScript.
@@ -77,13 +76,13 @@ Today, there are two ways that you can query a database with Prisma ORM:
In the first approach, Prisma ORM queries are passed to the query engine, written in Rust. This engine manages everything from building the query plan to executing queries and returning results to the JavaScript client:
-
+
However, this architecture cannot support databases that only provide JavaScript drivers, such as D1 and Turso. To address this limitation, we introduced driver adapters.
When using a driver adapter, the query engine still develops the query plan and generates SQL statements. The execution, however, is delegated through the driver adapter to the database:
-
+
This approach enables compatibility with JavaScript drivers but introduces a tradeoff: data must be serialized from JavaScript to Rust and then back to JavaScript, reducing efficiency and negating some of the benefits of this method.
@@ -91,7 +90,7 @@ This approach enables compatibility with JavaScript drivers but introduces a tra
In the new architecture, driver adapters will remain in use. However, instead of relying on a Rust-based query engine, Prisma ORM will pass the query to a WASM compiler, which will return the query plan. This plan will then be **executed entirely in TypeScript**:
-
+
This simplified architecture delivers several immediate benefits:
diff --git a/apps/blog/content/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/index.mdx b/apps/blog/content/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/index.mdx
index 4ea1f90956..316596c9fd 100644
--- a/apps/blog/content/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/index.mdx
+++ b/apps/blog/content/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/index.mdx
@@ -5,9 +5,11 @@ date: "2021-01-19"
authors:
- "Ryan Chenkie"
metaTitle: "Applying Full Stack Type Safety with Angular, Nest, Nx & Prisma"
-metaImagePath: "/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/imgs/meta-6edf92a2f15ffb62ed50e0da3deed2b2908d0156-2398x1208.png"
-heroImagePath: "/blog/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/imgs/hero-2e21e72be724fc37acc24f269c8b6a0628ad5a18-870x438.jpg"
+metaImagePath: "/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/imgs/meta-6edf92a2f15ffb62ed50e0da3deed2b2908d0156-2398x1208.png"
+heroImagePath: "/full-stack-typesafety-with-angular-nest-nx-and-prisma-ccmk7fbqftwc/imgs/hero-2e21e72be724fc37acc24f269c8b6a0628ad5a18-870x438.jpg"
heroImageAlt: "Full Stack Type Safety with Angular, Nest, Nx, and Prisma"
+tags:
+ - "education"
excerpt: |
TypeScript really shines when we can extend type safety to all parts of our stack. In this article, we'll look at how to apply type safety to every part of a full stack Angular and NestJS app, including database access. We'll see how to share types across the stack by using an Nx monorepo.
@@ -27,7 +29,7 @@ In this article, we'll look at how we can use the types generated by Prisma to a
Check out the [code for the project on GitHub](https://github.com/chenkie/shirt-shop).
-
+
## Create an Nx Workspace
@@ -46,7 +48,7 @@ npx create-nx-workspace --preset=angular
An interactive prompt takes us through the setup process. Select a name for the workspace and application and then continue through the prompts.
-
+
Once Nx finishes wiring up the workspace, open it up and try running the Angular application.
@@ -59,7 +61,7 @@ npm start
This command will tell Nx to serve the Angular application that was created as the workspace initialized. After it compiles, open up `localhost:4200` to make sure everything is working.
-
+
## Add a NestJS Application
@@ -189,17 +191,17 @@ npx prisma studio
Running this command will open Prisma Studio. In the browser, it opens at `localhost:5555`.
-
+
We can use Prisma Studio to add data to the database manually. This isn't a great approach if we have a lot of data to seed, but it's useful if we want to add a few records to test with.
Add as many rows as you like and input data for them. If you would like to work with the data seen in this article, you can grab it in [this gist](https://gist.github.com/chenkie/9bd80bc2767e72f71582a02e05c7f853).
-
+
Next, save the changes. IDs for each row will automatically be generated.
-
+
We now have all the pieces of our stack in place! We're ready to start writing some code to surface the data from the API and call for it from the Angular app.
@@ -299,11 +301,11 @@ export class AppModule {}
Now head over to the browser and test it out by going to `http://localhost:3333/api/products`.
-
+
It may not be very apparent at this point, but our endpoint has a layer of type safety applied to it that can help us out if we need to manipulate and/or modify data before it is returned to the client. For example, if we need to map over our data and get access to its properties, we now have full autocompletion enabled when we do so. This occurs because we told the `getProducts` method in the `ProductsService` that the return type is a `Promise` that resolves with an array of type `Product`.
-
+
Now that we have the API working, let's wire up the Angular application to make a call for this data and display it!
@@ -562,7 +564,7 @@ export class ProductsComponent implements OnInit {
This is another spot where we're using our `Product` type from `@prisma/client` to give ourselves type safety. Applying this type directly to the `$products` observable means that we can get autocompletion in our Angular templates.
-
+
With our component in place, we're now ready to call it from the `shirt-shop` app and display the results!
@@ -576,7 +578,7 @@ Open up `apps/shirt-shop/src/app/app.component.html` and include the `Products`
```
-
+
## Going Beyond Displaying Data
diff --git a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/index.mdx b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/index.mdx
index 8057ff5bd8..4e548b7a3c 100644
--- a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/index.mdx
+++ b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/index.mdx
@@ -7,15 +7,16 @@ authors:
- "Alex Ruheni"
metaTitle: "Fullstack app with TypeScript, Next.js, Prisma & GraphQL - GraphQL API"
metaDescription: "Learn how to build a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma. In this article you are going to create a GraphQL API'"
-metaImagePath: "/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/imgs/hero-3c25e8ccea9b86c6d7a625f95cd6b42f76c8c5e7-1269x714.png"
-heroImagePath: "/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/imgs/hero-3c25e8ccea9b86c6d7a625f95cd6b42f76c8c5e7-1269x714.png"
+metaImagePath: "/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/imgs/hero-3c25e8ccea9b86c6d7a625f95cd6b42f76c8c5e7-1269x714.png"
+heroImagePath: "/fullstack-nextjs-graphql-prisma-2-fwpc6ds155/imgs/hero-3c25e8ccea9b86c6d7a625f95cd6b42f76c8c5e7-1269x714.png"
heroImageAlt: "Fullstack App With TypeScript, PostgreSQL, Next.js, Prisma & GraphQL: GraphQL API"
series:
title: "Building a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma"
- slug: "fullstack-nextjs-and-graphql-md1tczpfz1"
seriesIndex: 2
excerpt: This article is the second part of a course where you build a fullstack app with Next.js, GraphQL, TypeScript, Prisma, and PostgreSQL. In this article, you will create the GraphQL API and interact with it on the frontend.
+tags:
+ - "education"
---
## Table of contents
@@ -90,7 +91,7 @@ npm run dev
```
The app will be running at [`http://localhost:3000/`](http://localhost:3000/) and you will see four items. The data is hardcoded and comes from the `/data/links.ts` file.
-
+
## Seeding the database
@@ -229,7 +230,7 @@ query {
}
}
```
-
+
The API only returns the `id` and `title`, even though a link has more fields.
@@ -464,7 +465,7 @@ npm run dev
```
When you navigate to [`http://localhost:3000/api/graphql/`](http://localhost:3000/api/graphql/), you should see the following page:
-
+
GraphQL Yoga provides an interactive playground called GraphiQL you could use to explore the GraphQL schema and interact with your API.
@@ -479,13 +480,13 @@ query {
}
}
```
-
+
The responses should be visible on the left panel, similar to the screenshot above.
The Documentation Explorer (top left button on the page) will allow you to explore each query/mutation individually, seeing the different needed arguments along with their types.
-
+
### Initialize Prisma Client
@@ -682,7 +683,7 @@ export const config = {
Make sure the server is running and navigate to `http://localhost:3000/api/graphql`. You will be able to send a query with an `ok` field, which will return `true`
-
+
### Defining the schema using Pothos
@@ -782,7 +783,7 @@ The `query` argument in the resolver function adds a `select` or `include` to yo
Now if you go back to the GraphiQL, you will be able to send a query that returns all links from the database.
-
+
## Client-side GraphQL queries
@@ -936,13 +937,13 @@ Now at the database level, there are two pagination techniques that you can use:
For more information on why you may want to use off-set based pagination, check out the [documentation](https://www.prisma.io/docs/concepts/components/prisma-client/pagination#use-cases-for-offset-pagination).
-
+
- Cursor-based pagination: you use a cursor to bookmark a location in a result set. On subsequent requests you can then jump straight to that saved location. Similar to how you can access an array by its index.
The cursor must be a unique, sequential column - such as an ID or a timestamp. This approach is more efficient than offset-based pagination and will be the one you use in this tutorial.
-
+
### Pagination in GraphQL
@@ -991,7 +992,7 @@ Alternatively, you can make this request as the user reaches the end of the page
The way this works is that you fetch some data as the page first loads. Then after clicking a button, you send a second request to the API which includes how many items you want returned and a cursor. The data is then returned and displayed on the client.
-
+
> **Note**: an example of two-way pagination is a chat app like Slack, where you can load messages by going forwards or backwards.
@@ -1090,7 +1091,7 @@ builder.queryField('links', (t) =>
Here is a diagram that summarizes how pagination works on the server:
-
+
### Pagination on the client using `fetchMore()`
diff --git a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/index.mdx b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/index.mdx
index e2c051cea7..8915a2a7e7 100644
--- a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/index.mdx
+++ b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/index.mdx
@@ -7,13 +7,14 @@ authors:
- "Alex Ruheni"
metaTitle: "Fullstack app with TypeScript, Next.js, Prisma & GraphQL - Authentication"
metaDescription: "Learn how to build a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL, and Prisma. In this article, you will learn how to add authentication and authorization to your application using Auth0"
-metaImagePath: "/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/imgs/meta-91075c8f117cdbd825ecc504f44bf57d5916e0af-1269x714.png"
-heroImagePath: "/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/imgs/hero-6e7a91ceafb378a17154ba9cb238ed0953434c64-844x474.svg"
+metaImagePath: "/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/imgs/meta-91075c8f117cdbd825ecc504f44bf57d5916e0af-1269x714.png"
+heroImagePath: "/fullstack-nextjs-graphql-prisma-3-clxbrcqppv/imgs/hero-6e7a91ceafb378a17154ba9cb238ed0953434c64-844x474.svg"
heroImageAlt: "Fullstack App With TypeScript, PostgreSQL, Next.js, Prisma & GraphQL: Authentication"
series:
title: "Building a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma"
- slug: "fullstack-nextjs-and-graphql-md1tczpfz1"
seriesIndex: 3
+tags:
+ - "education"
excerpt: |
This article is the third part of the course where you build a fullstack app with Next.js, GraphQL, TypeScript, Prisma
and PostgreSQL. In this article, you will learn how to add authentication to your app.
@@ -154,11 +155,11 @@ To secure the app, you will use [Auth0](https://auth0.com) – an authentication
After [creating an account](https://auth0.com/signup), navigate to the **Applications** dropdown located on the left sidebar and select **Applications** from the sub-menu.
-
+
Next, create a new application by clicking the **+ Create application** button. Give your app a name, select **Regular Web Application** and finalize creating the app by selecting the **Create** button on the bottom right of the dialog.
-
+
Once the application is successfully created, navigate to the **Settings** tab and copy the following information to the `.env` file of your project:
@@ -166,7 +167,7 @@ Once the application is successfully created, navigate to the **Settings** tab a
- Client ID
- Client Secret
-
+
```shell
# .env
@@ -188,7 +189,7 @@ Save these configuration changes by clicking the **Save Changes** button at the
When you're deploying your app to production, you can replace `localhost` with your deployed app's domain. Auth0 allows multiple URLs, so you can include both `localhost` and production URLs – separated by a comma.
-
+
### Add the Auth0 SDK
@@ -379,7 +380,7 @@ The `useUser` hook from Auth0 checks whether a user is authenticated or not. Thi
If you have done all the previous steps correctly, you should be able to sign up and login to the app!
-
+
> Note: If you want to only allow authenticated requests to your GraphQL API, you can use the [`withApiAuthRequired`](https://github.com/auth0/nextjs-auth0/blob/main/EXAMPLES.md#protect-an-api-route) function from Auth0 to secure it.
@@ -394,19 +395,19 @@ You will define an API route that will receive the information sent from the Aut
To get started with Auth0 Actions, navigate to the **Actions** dropdown located in the left sidebar, select **Flows** and choose **Login**.
-
+
Next, to create a new Action, click the **+** icon and choose **Build custom**.
-
+
Pick a name for your custom Action, for example, "Create DB User" and complete the process by selecting **Create**.
-
+
After completing the previous step, you will be able to manage your newly created Action.
-
+
Here is a breakdown of the Auth0 Actions UI:
@@ -417,7 +418,7 @@ Here is a breakdown of the Auth0 Actions UI:
The first step is to include the `node-fetch` module version `2.6.1`. You will use it in your Action to send a request to an API endpoint – you will create this later. This endpoint will handle the logic of creating a user record in the database.
-
+
Next, define a secret that will be included in every request sent by the Action to your endpoint. This secret will ensure that the requests are coming from the Auth0 Action instead of another untrusted third party.
@@ -428,14 +429,14 @@ openssl rand -hex 32
```
First, store this secret in the Auth0 dashboard with the key `AUTH0_HOOK_SECRET`.
-
+
Now, also store the secret in your `.env` file.
```shell
AUTH0_HOOK_SECRET='' # same secret goes here
```
-
+
Finally, update the Action with the following code:
@@ -493,7 +494,7 @@ npx ngrok http 3000 --authtoken "TOKEN"
The output on your terminal will resemble the following – but with different **Forwarding** URLs:
-
+
Copy the **Forwarding** URL, replace `localhost:3000` with your **Forwarding** URL in your Action and click **Deploy**.
@@ -501,7 +502,7 @@ Now that the action is deployed, go back to the **Login** flow by pressing the *
The final thing you need to do is add your newly created action to the **Login** flow. You will find the action underneath the **Custom** tab. To add the action to your flow, you can drag-and-drop it between **Start** and **Complete**. Then click **Apply** to save the changes.
-
+
### Define an API route for creating new users
@@ -545,7 +546,7 @@ This endpoint does the following:
Once a user signs up to your application, the user's information will be synced to your database. You can view the newly created user in your database through Prisma Studio.
-
+
### Create links – auth protected page
@@ -896,7 +897,7 @@ You can change this by modifying the `role` field of the user in the database. T
First start Prisma Studio by running `npx prisma studio` in the terminal. Then click the **User** model and find the record matching the current user. Now, go ahead and update your user role from `USER` to `ADMIN`. Save your changes by pressing the **Save 1 change** button.
-
+
Navigate to the `/admin` page of your application and voila! You can now create links again.
diff --git a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/index.mdx b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/index.mdx
index 2e77b3ad05..0d9e4a49f5 100644
--- a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/index.mdx
+++ b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/index.mdx
@@ -7,13 +7,14 @@ authors:
- "Alex Ruheni"
metaTitle: "Fullstack app with TypeScript, Next.js, Prisma & GraphQL - Image upload "
metaDescription: "Learn how to build a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma. In this article you are going to learn how to add image upload using AWS S3"
-metaImagePath: "/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/imgs/meta-020d4caf40065aad2ab5d59cff56d2bec9470bd9-1269x714.png"
-heroImagePath: "/blog/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/imgs/hero-0672449d4925722e1d058122cf3ef071ca3235e4-844x474.svg"
+metaImagePath: "/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/imgs/meta-020d4caf40065aad2ab5d59cff56d2bec9470bd9-1269x714.png"
+heroImagePath: "/fullstack-nextjs-graphql-prisma-4-1k1kc83x3v/imgs/hero-0672449d4925722e1d058122cf3ef071ca3235e4-844x474.svg"
heroImageAlt: "Fullstack App With TypeScript, PostgreSQL, Next.js, Prisma & GraphQL: Image upload"
series:
title: "Building a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma"
- slug: "fullstack-nextjs-and-graphql-md1tczpfz1"
seriesIndex: 4
+tags:
+ - "education"
excerpt: |
This article is the fourth part of the course where you build a fullstack app with Next.js, GraphQL, TypeScript,
Prisma and PostgreSQL. In this article, you will learn how to add image upload using AWS S3.
@@ -38,7 +39,7 @@ excerpt: |
In this course you will learn how to build "awesome-links", a fullstack app where users can browse through a list of curated links and bookmark their favorite ones.
-In [part 3](/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv), you added authentication to the app and created a page for adding new links using placeholder images.
+In [part 3](/fullstack-nextjs-graphql-prisma-3-clxbrcqppv), you added authentication to the app and created a page for adding new links using placeholder images.
This guide will teach you how to add support for image upload using AWS S3. If you're following along from part 3, you can skip project setup and jump into the [using AWS S3 to add support for image upload](#using-aws-s3-to-add-suport-for-image-upload) section.
@@ -79,11 +80,11 @@ If `prisma migrate dev` did not trigger the seed step, run the following command
```shell
npx prisma db seed
```
-> Refer to [Part 1 – Add Prisma to your Project](/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw#add-prisma-to-your-project) for more details on the format of the connection string.
+> Refer to [Part 1 – Add Prisma to your Project](/fullstack-nextjs-graphql-prisma-oklidw1rhw#add-prisma-to-your-project) for more details on the format of the connection string.
This command will run the `seed.ts` file in the `/prisma` directory. `seed.ts` creates four links and one user in your database using Prisma Client.
-> Note: Refer to [part 3](/blog/fullstack-nextjs-graphql-prisma-3-clxbrcqppv) for how to set up Auth0.
+> Note: Refer to [part 3](/fullstack-nextjs-graphql-prisma-3-clxbrcqppv) for how to set up Auth0.
### Project structure and dependencies
@@ -165,35 +166,35 @@ To interact with AWS resources, you have to create an [Identity Access Managemen
To do that, select **Security Credentials** from the dropdown menu located in the top right corner of the page – where your username is.
-
+
Next, select the **Users** option from the **Access Management** dropdown located in the left sidebar.
-
+
Next, click the **Add users** button to create a new user.
-
+
Provide a recognizable username for the newly created user and check the **Access key - programmatic access** checkbox.
-
+
Next, you need to specify what the user can do with different AWS resources by setting permissions. Select the **Attach existing policies directly** option and type "S3" in the search filter. Select **AmazonS3FullAccess**.
-
+
You can optionally define tags for newly created IAM users, but you do not need to do that for this project, so click **Next: Review**.
-
+
After reviewing that the user has the correct permissions and username, click **Create user**.
-
+
Finally, copy the "Access Key ID" and the "Secret Access Key" and store them in your `.env` file
-
+
> Note: These credentials can only be viewed once, so in case you lose these credentials or want to change them, you will need to generate new ones.
@@ -206,12 +207,12 @@ APP_AWS_SECRET_KEY = ''
The next step is to create an AWS S3 bucket which will store the uploaded objects. You can find the S3 service by looking it up in the search bar or by going to [https://s3.console.aws.amazon.com/](https://s3.console.aws.amazon.com/).
-
+
> Note: there are different ways you can provison resources in AWS, you are using the AWS console for simplicity
Next, click on **Create bucket** to create a new bucket.
-
+
Pick a name and a region for your bucket. Save these values in your `.env` file.
@@ -225,16 +226,16 @@ NEXT_PUBLIC_AWS_S3_BUCKET_NAME = '' # Will be used on the client-side
Go ahead and create the bucket by navigating to the bottom of the page and clicking the **Create bucket** button. You can stick with the defaults settings for now, but you'll update them in the following steps.
-
+
Once S3 has provisioned the Bucket, navigate to it by selecting it in the table.
Navigate to the **Permissions** tab and click on the **Edit** button in the **Block public access (bucket settings)** section.
-
+
Uncheck **Block _all_ public access** and click on **Save changes**. You need to allow public access because your application needs to access the images uploaded on AWS S3.
-
+
Next, update the resource policy to grant the application access to the Bucket and its contents. In the **Permissions** of your S3 Bucket, navigate to the **Bucket policy** section. Select **Edit** and add the following while changing "name-of-your-bucket" placeholder to the name of your Bucket:
@@ -255,7 +256,7 @@ Next, update the resource policy to grant the application access to the Bucket a
]
}
```
-
+
Next, you need to allow your application, which will be on a different domain, to access the stored images. In the **Permissions** tab of your bucket, scroll to the **Cross-origin Resource Sharing (CORS)** section at the bottom and add the following to it:
@@ -269,7 +270,7 @@ Next, you need to allow your application, which will be on a different domain, t
}
]
```
-
+
> Note: Before deploying your application, ensure you update the "AllowedOrigins" array with the URL pointing to your application.
@@ -503,5 +504,5 @@ When the form is submitted, the URL of the image is included as a variable in th
## Summary and next steps
-You learned how to add support for image upload using AWS S3. In the [next part](/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c), you will deploy your app to Vercel and learn how you can use the Prisma Data Proxy to manage your database connection pool to ensure your application doesn't run out of connections.
+You learned how to add support for image upload using AWS S3. In the [next part](/fullstack-nextjs-graphql-prisma-5-m2fna60h7c), you will deploy your app to Vercel and learn how you can use the Prisma Data Proxy to manage your database connection pool to ensure your application doesn't run out of connections.
diff --git a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/index.mdx b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/index.mdx
index f8d2855d75..38d4054abf 100644
--- a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/index.mdx
+++ b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/index.mdx
@@ -7,13 +7,14 @@ authors:
- "Mahmoud Abdelwahab"
metaTitle: "Fullstack app with TypeScript, Next.js, Prisma & GraphQL - Deployment"
metaDescription: "Learn how to build a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma. In this article you are going to deploy your app to Vercel"
-metaImagePath: "/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/imgs/meta-6b91985fb8bb4d0d06e95090aab1d8b0ede0696b-1269x714.png"
-heroImagePath: "/blog/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/imgs/hero-487ed996090048a8225eec985d2ea001c5e1486b-844x474.svg"
+metaImagePath: "/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/imgs/meta-6b91985fb8bb4d0d06e95090aab1d8b0ede0696b-1269x714.png"
+heroImagePath: "/fullstack-nextjs-graphql-prisma-5-m2fna60h7c/imgs/hero-487ed996090048a8225eec985d2ea001c5e1486b-844x474.svg"
heroImageAlt: "Fullstack App With TypeScript, PostgreSQL, Next.js, Prisma & GraphQL: Deployment"
series:
title: "Building a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma"
- slug: "fullstack-nextjs-and-graphql-md1tczpfz1"
seriesIndex: 5
+tags:
+ - "education"
excerpt: |
This article is the final part of the course where you build a fullstack app with Next.js, GraphQL, TypeScript, Prisma, and PostgreSQL. In this article, you will learn how to deploy your app to Vercel.
@@ -56,7 +57,7 @@ When a serverless function needs to access a database, it establishes a connecti
When there's a traffic spike, each serverless function will spawn a new database connection.
-
+
Traditional databases such as PostgreSQL and MySQL typically have a _database connection limit_ that can be easily exhausted when there's a traffic spike to your application. When the connection limit is exhausted, the requests to your application would start failing.
@@ -72,20 +73,20 @@ Go to [https://cloud.prisma.io/projects/create](https://cloud.prisma.io/projects
In the "Create project" page, paste in your database's connection string to connect your project to the database. If your database is behind a Static IP, enable the feature in the "Static IP" section. Once you're done, click **Create project**.
-
+
Once your project is created, you should be redirected to the "Get started" page. You can connect your project to your GitHub repository in the "Enable schema synchronization" section, however, it's completely optional.
-
+
To create a Data Proxy connection string, click the **Create a new connection string** button in the "Create a Data Proxy new connection string" section. Give your connection string a name and click **Create** once you're ready.
-
-
+
+
Copy the Prisma Data Proxy URL as you won't be able to see it again, but you can create more later.
-
+
## Update the application
@@ -119,11 +120,11 @@ The `vercel-build` script will generate Prisma Client that uses the Prisma Data
Log in to your Vercel account and create a new project by clicking **New Project**.
-
+
Next, import the "awesome-links" repository.
-
+
Finally, add your environment variables.
@@ -134,7 +135,7 @@ Refer to the `.env.example` file in the repository for the environment variables
Once you've added the environment variables, click **Deploy**.
-
+
Once your application is successfully deployed, copy its URL and:
- Update the **Allowed Callback URLs** and **Allowed Logout URLs** on the Auth0 Dashboard with the URL of your application
diff --git a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/index.mdx b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/index.mdx
index 42c1ef2c75..3fac04b8bd 100644
--- a/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/index.mdx
+++ b/apps/blog/content/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/index.mdx
@@ -6,13 +6,14 @@ authors:
- "Mahmoud Abdelwahab"
metaTitle: "Fullstack app with TypeScript, Next.js, Prisma & GraphQL"
metaDescription: "Build a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma. In this article we're going to create the app's data model"
-metaImagePath: "/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/imgs/meta-1ec6d4e3035143375360a59242258c3c93609907-1269x714.png"
-heroImagePath: "/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw/imgs/hero-cf0efe94442ee755fc47d4c085a10f2b453c74a6-844x475.svg"
+metaImagePath: "/fullstack-nextjs-graphql-prisma-oklidw1rhw/imgs/meta-1ec6d4e3035143375360a59242258c3c93609907-1269x714.png"
+heroImagePath: "/fullstack-nextjs-graphql-prisma-oklidw1rhw/imgs/hero-cf0efe94442ee755fc47d4c085a10f2b453c74a6-844x475.svg"
heroImageAlt: "Fullstack App With TypeScript, PostgreSQL, Next.js, Prisma & GraphQL: Data Modeling"
series:
title: "Building a fullstack app using TypeScript, PostgreSQL, Next.js, GraphQL and Prisma"
- slug: "fullstack-nextjs-and-graphql-md1tczpfz1"
seriesIndex: 1
+tags:
+ - "education"
excerpt: |
This article is the first part of a course where we build a fullstack app with Next.js, GraphQL, TypeScript,Prisma and PostgreSQL. In this article, we'll create the data model and explore the different components of Prisma.
@@ -122,7 +123,7 @@ npm run dev
```
Here's what the starter project looks like:
-
+
### A look at the project structure and dependencies
@@ -214,7 +215,7 @@ DATABASE_URL=""
```
The database URL you just added has the following structure:
-
+
| Name | Placeholder | Description |
| :------- | :---------- | :-------------------------------------------------------------------------------------------------------------- |
@@ -599,7 +600,7 @@ npx prisma studio
```
If you've done all the steps correctly you should you have the `Link` and `User` models inside your database. Inside the `Link` model you'll find 4 records and for the `User` model you'll find 1 record.
-
+
## Summary and next steps
diff --git a/apps/blog/content/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/index.mdx b/apps/blog/content/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/index.mdx
index de17bad4d3..7b3655b7c4 100644
--- a/apps/blog/content/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/index.mdx
+++ b/apps/blog/content/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/index.mdx
@@ -6,20 +6,17 @@ authors:
- "Sabin Adams"
metaTitle: "Build A Fullstack App with Remix, Prisma & MongoDB - Project Setup"
metaDescription: "Learn how to build and deploy a fullstack application using Remix, Prisma, and MongoDB. In this article, we will be setting up our project, the MongoDB instance, Prisma, and begin modeling out some of our data for the next section of this series."
-metaImagePath: "/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/imgs/meta-f24cae902752ee69692b9010216f2d207af37321-1920x1080.png"
-heroImagePath: "/blog/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/imgs/hero-23f25185781fa115971071b951ef70832386640b-844x474.svg"
+metaImagePath: "/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/imgs/meta-f24cae902752ee69692b9010216f2d207af37321-1920x1080.png"
+heroImagePath: "/fullstack-remix-prisma-mongodb-1-7d0bftxbmb6r/imgs/hero-23f25185781fa115971071b951ef70832386640b-844x474.svg"
heroImageAlt: "Build A Fullstack App with Remix, Prisma & MongoDB: Project Setup"
series:
title: "Build A Fullstack App with Remix, Prisma & MongoDB"
- slug: "fullstack-remix-prisma-mongodb-MaTVLuwpaICD"
seriesIndex: 1
excerpt: Welcome to the first article in this series, where you will take a look at how to build a full-stack application from the ground up using MongoDB, Prisma, and Remix! In this article, you will be setting up your project, the MongoDB instance, Prisma, and begin modeling out some of our data for the next section of this series.
-
+tags:
+ - "education"
---
-import { Youtube } from "@/components/Youtube";
-import { Accordion, Accordions } from "@prisma-docs/eclipse";
-
## Table Of Contents
- [Introduction](#introduction)
@@ -48,7 +45,7 @@ The goal of this series is to take an in-depth look at how to start, develop and
By the end of this series, you will have built and deployed an application called "Kudos", a site where users can create an account, log in, and give kudos to other users of the site. It will end up looking something like this:
-
+
### Technologies we will use
@@ -153,7 +150,7 @@ This is one of the magical pieces of Remix that makes development so easy! Of co
If you run this project with the command `npm run dev` and head over to [http://localhost:3000/](http://localhost:3000/), you should see the basic starter application.
-
+
Great! Your basic project is started up and Remix has already scaffolded out many of the pieces you would normally have had to set up manually, such as the routing and build process. Now you will move on to setting up TailwindCSS so you can make the application look nice!
@@ -270,7 +267,7 @@ export default function Index() {
```
You should see a screen that looks something like this:
-
+
> **Note**: If you do not see Tailwind's styles being applied to your page, you may need to restart your development server.
@@ -290,11 +287,11 @@ Head over to the Atlas home page linked above. If you don't already have an acco
If you will be using an existing account, head to the dashboard. From there you will see a dropdown in the top left corner of the screen. If you pop that open you will see the option New Project.
- 
+ 
Once you click on that, hit the **Build a Database** button.
- 
+ 
From there you should be able to follow along with the rest of the steps below.
@@ -302,21 +299,21 @@ If you will be using an existing account, head to the dashboard. From there you
You should land on a screen with a few options. Choose the **Free** option for the purposes of this series. Then hit the **Create** button:
-
+
When you select that option, you will be brought to a page that allows you to configure the cluster that will be generated. For your application, you can use the default settings. Just click **Create Cluster** near the bottom right of the page.
-
+
This will kick off the provisioning and deployment of your MongoDB cluster! All you need now is a database user and a way to connect to the database. Fortunately, MongoDB will walk you through this setup during their quickstart process.
You will see a few prompts that help you make these configurations. Follow the prompts to create a new user.
-
+
Then, in the **Where would you like to connect from?** section, hit **Add My Current IP Address** to whitelist your development machine's IP address, allowing it to connect to the database.
-
+
With those steps completed, your database should finish its provisioning process within a few minutes *(at most)* and be ready for you to play with!
@@ -366,15 +363,15 @@ You will now give Prisma the correct connection string in your [environment vari
To find your connection string on the Atlas dashboard hit the **Connect** button.
-
+
This will pop open a modal. Hit the **Connect your application** option.
-
+
This should reveal a few bits of information. The piece you care about is the connection string.
-
+
In your `.env` file, replace the default connection string with your MongoDB connection string. This connection string should follow this format:
@@ -456,7 +453,7 @@ Applying the following changes:
```
Because MongoDB is _schemaless_, there is no real concept of _migrations_. A schemaless database's data can fluidly change and evolve as the application's scope grows and changes. This command simply creates the defined collections and indexes.
-
+
## Summary & What's next
diff --git a/apps/blog/content/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/index.mdx b/apps/blog/content/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/index.mdx
index b4ec52ea6b..24fde2c4da 100644
--- a/apps/blog/content/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/index.mdx
+++ b/apps/blog/content/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/index.mdx
@@ -6,15 +6,16 @@ authors:
- "Sabin Adams"
metaTitle: "Build A Fullstack App with Remix, Prisma & MongoDB - Authentication"
metaDescription: "Learn how to build and deploy a fullstack application using Remix, Prisma, and MongoDB. In this article, we will be setting up authentication for our Remix application using session-based authentication."
-metaImagePath: "/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/imgs/meta-4b70ee51aee99eaddac2a48baa614189c5fa74c2-1920x1080.png"
-heroImagePath: "/blog/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/imgs/hero-29016ded5a59403f81349c8247116f8f084a0ae2-844x474.svg"
+metaImagePath: "/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/imgs/meta-4b70ee51aee99eaddac2a48baa614189c5fa74c2-1920x1080.png"
+heroImagePath: "/fullstack-remix-prisma-mongodb-2-ztmoy58p4re8/imgs/hero-29016ded5a59403f81349c8247116f8f084a0ae2-844x474.svg"
heroImageAlt: "Build A Fullstack App with Remix, Prisma & MongoDB: Authentication"
series:
title: "Build A Fullstack App with Remix, Prisma & MongoDB"
- slug: "fullstack-remix-prisma-mongodb-MaTVLuwpaICD"
seriesIndex: 2
excerpt: Welcome to the second article of this series where you are learning how to build a full-stack application from the ground up using MongoDB, Prisma, and Remix! In this part, you will set up session-based authentication for your Remix application.
+tags:
+ - "education"
---
## Table Of Contents
@@ -84,7 +85,7 @@ The default export of a route file is the component Remix renders into the brows
Start the development server using `npm run dev` and navigate to [`http://localhost:3000/login`](http://localhost:3000/login), and you should see the route rendered.
-
+
This works, but doesn't look very nice yet... Next you will spruce it up a bit by adding an actual sign in form.
@@ -191,7 +192,7 @@ export default function Login() {
)
}
```
-
+
At this point, you don't need to worry about where the `