Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

spacing + punctuation #24

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
+43 −52
Open

spacing + punctuation #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/RecommendationPage.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import CodeBlock from "./CodeBlock.astro";
>
<h1 class="text-2xl">Starting a new dev project?</h1>
<div class="py-4"></div>
<h2 class="text-xl font-light">We Recommend Using</h2>
<h2 class="text-xl font-light text-center">We recommend using</h2>
<div class="pt-2"></div>
<CodeBlock />
<div class="absolute bottom-0 w-full flex justify-center p-4">
Expand Down
42 changes: 19 additions & 23 deletions src/components/WhyPage.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,27 +13,22 @@
href="https://www.typescriptlang.org/"
target="_blank"
rel="noreferrer"
>
TypeScript
</a>
?
>TypeScript</a>?
</h2>
<p>Javascript is hard. Why add more rules?</p>
<p>JavaScript is hard. Why add more rules?</p>
<p>
We firmly believe the experience{" "}
<a
target="_blank"
rel="noreferrer"
href="https://www.typescriptlang.org/"
class="link-light"
>
TypeScript
</a>{" "}
>TypeScript</a>{" "}
provides will{" "}
<span class="italic">help you be a better developer,</span>{" "}
regardless of where you are in your career as an engineer. Whether you're new
to web development or a seasoned pro, the "strictness" of TypeScript will provide
a less frustrating, more consistent experience than vanilla JS
a less frustrating, more consistent experience than vanilla JavaScript.
</p>

<div class="p-4"></div>
Expand All @@ -45,10 +40,7 @@
href="https://nextjs.org/"
target="_blank"
rel="noreferrer"
>
Next.js
</a>
?
>Next.js</a>?
</h2>
<p>
We love React. It has made UI development accessible in ways we never
Expand All @@ -60,27 +52,31 @@
rel="noreferrer"
href="https://nextjs.org/"
class="link-light"
>
Next.js
</a>{" "}
>Next.js</a>{" "}
offers a lightly opinionated, heavily optimized approach to creating a website
using React. From routing to API definitions to image rendering, we trust Next.js
using React. From routing to API definitions to image rendering, we trust
<a
target="_blank"
rel="noreferrer"
href="https://nextjs.org/"
class="link-light"
>Next.js</a>{" "}
to lead developers towards good decisions.
</p>

<div class="p-4"></div>

<h2 class="text-xl font-bold">Why tRPC/Prisma/Tailwind/etc?</h2>
<h2 class="text-xl font-bold">Why tRPC/Prisma/Tailwind?</h2>
<p>
While we believe in keeping things as simple as possible, we find these
pieces being used in every "app" like project we build.{" "}
<a class="link-light" href="https://create.t3.gg"> create-t3-app </a>{" "}
<a class="link-light" href="https://create.t3.gg">create-t3-app</a>{" "}
does a great job of letting you adopt{" "}
<a href="/others">the pieces you need</a>
<a class="link-light" href="/others">the pieces you need.</a>
</p>
<p class="link-light">
<a href="/others">
Here are some recommendations for when things get more complex
<p>
<a class="link-light" href="/others">
Here are some recommendations for when things get more complex.
</a>
</p>
</div>
Expand Down
51 changes: 23 additions & 28 deletions src/pages/others.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import Layout from "../layouts/main.astro";
class="flex flex-col items-center min-h-screen justify-center cursor-default relative"
>
<div class="max-w-md md:max-w-2xl text-lg p-4 my-12">
<h2 class="text-2xl font-bold mt-4 mb-2">Other Recommendations</h2>
<h1 class="text-2xl font-semibold mt-8 mb-2">Other Recommendations</h1>
<p>
We recognize that Next.js and TypeScript don't solve every problem.
While we encourage you to use the primitives they provide as often as
Expand All @@ -31,8 +31,8 @@ import Layout from "../layouts/main.astro";
<p>I hated the idea of Tailwind. Then I tried it.</p>
<p>
<span class="italic">It seems like Bootstrap.</span> I promise it is not
Bootstrap. It enables a "flow state" in UI dev I didn't know was achievable.
(and yes we used it here)
Bootstrap. It enables a "flow state" in UI development I didn't know was achievable.
(And yes, we used it here.)
</p>

<h1 class="text-2xl mb-4 mt-8 font-semibold">Data Management</h1>
Expand All @@ -48,8 +48,8 @@ import Layout from "../layouts/main.astro";
</a>
</h2>
<p>
This little library handles all your async React needs from data
fetching to IO management. Hard to imagine doing React dev without it
This little library handles all your async React needs, from data
fetching to IO management. Hard to imagine doing React development without it
now. Might be able to replace your state management library too.
</p>

Expand All @@ -64,7 +64,7 @@ import Layout from "../layouts/main.astro";
</a>
</h2>
<p>
Prisma is to SQL what TypeScript is to JS. Never thought I'd love an
Prisma is to SQL what TypeScript is to JavaScript. Never thought I'd love an
ORM, but man, trust me on this one.
</p>

Expand All @@ -81,7 +81,7 @@ import Layout from "../layouts/main.astro";
<p>
tRPC delivers on GraphQL's promise of seamless client development
against a typesafe server without all of the boilerplate. It's a clever
abuse of TypeScript that provides an incredible dev experience.
abuse of TypeScript that provides an incredible development experience.
</p>

<h1 class="text-2xl mb-4 mt-8 font-semibold">Analytics</h1>
Expand All @@ -96,8 +96,8 @@ import Layout from "../layouts/main.astro";
</a>
</h2>
<p>
Need analytics? Plausible is one of the quickest ways to get them. Super
minimal. It even has a{" "}
Need analytics? Plausible is one of the quickest ways to get them. It's super
minimal and even has a{" "}
<a
target="_blank"
rel="noreferrer"
Expand All @@ -121,13 +121,12 @@ import Layout from "../layouts/main.astro";
</a>
</h2>
<p>
Man this library makes auth easy. No ownership compromise, hooks up to
your DB directly. So good that I ported two projects to Next to use it.
Man, this library makes auth easy. No ownership compromise and it hooks up to
your DB directly. It's so good that I ported two projects to Next.js just to use it.
</p>
<p>
Note:{" "}
<span class="italic">
Does not support React Native directly. Yet.
Note: NextAuth.js does not support React Native directly. Yet.
</span>{" "}
😉
</p>
Expand All @@ -149,7 +148,7 @@ import Layout from "../layouts/main.astro";
<p>
Vercel took the hell of web deployments and made it a set-and-forget
GitHub integration. We've scaled to hundreds of thousands of users
without issue. AWS-powered, just a way better interface :)
without issue. AWS-powered, but with a way better interface. 🙂
</p>

<h2 class="text-xl mt-4">
Expand All @@ -159,13 +158,13 @@ import Layout from "../layouts/main.astro";
href="https://planetscale.com/"
class="link-dark"
>
PlanetScale - for databases without the worry
PlanetScale - for databases, without the worry
</a>
</h2>
<p>
PlanetScale is the best "serverless database platform" I've used by far.
Insane scale, great developer experience, fantastic pricing. If you're
using sql (and hopefully Prisma), this is hard to beat.
using SQL (and hopefully Prisma), this is hard to beat.
</p>

<h2 class="text-xl mt-4">
Expand Down Expand Up @@ -193,10 +192,8 @@ import Layout from "../layouts/main.astro";
rel="noreferrer"
href="https://react-query.tanstack.com/"
class="link-dark"
>
React Query
</a>{" "}
and built-in React state, reach for these when you need more
>React Query</a>{" "}
and built-in React state, then reach for these when you need more.
</p>

<h2 class="text-xl mt-4">
Expand All @@ -219,8 +216,8 @@ import Layout from "../layouts/main.astro";
>
Poimandres
</a>{" "}
can always be trusted. I have built everything from video call apps to games
to servers with this little library
can always be trusted. I have built everything from video call apps, to games,
to servers with this little library.
</p>

<h2 class="text-xl mt-4">
Expand All @@ -240,12 +237,10 @@ import Layout from "../layouts/main.astro";
rel="noreferrer"
href="https://github.com/pmndrs"
class="link-dark"
>
Poimandres
</a>
, Jotai lets you define singletons that feel like global{" "}
<code>useState</code>. Great option for stateful behaviors that don't
need a state machine just yet
>Poimandres</a>,
Jotai lets you define singletons that feel like global{" "}
<code>useState</code>. It's a great option for stateful behaviors that don't
need a state machine just yet.
</p>
</div>
</div>
Expand Down