---
sidebar_position: 2
---

# Right Aligned Border Bottom FAQ

![Cards](/img/components-rightallignedborderbottom-faq.png)

```jsx title="Frontend/sections/FAQ/RightAlignedBorderBottomFAQ.tsx"
<div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
  {/* Grid */}
  <div className="grid md:grid-cols-5 gap-10">
    <div className="md:col-span-2">
      <div className="max-w-xs">
        <h2 className="text-2xl font-bold md:text-4xl md:leading-tight text-base-content">
          Frequently
          <br />
          asked questions
        </h2>
        <p className="mt-1 hidden md:block text-base-content/80 ">
          Answers to the most frequently asked questions.
        </p>
      </div>
    </div>
    {/* End Col */}
    {/* Accordion */}
    <div className="md:col-span-3 space-y-6">
      {/* My tech stack is different can I still use it? */}
      <div className="collapse collapse-plus bg-base-200">
        <input
          type="radio"
          name="my-accordion-3"
          className="w-auto h-auto"
          defaultChecked
        />
        <div className="collapse-title text-xl font-medium">
          My tech stack is different can I still use it?
        </div>
        <div className="collapse-content">
          <p>
            Yes, as long as you&apos;re comfortable with React & NextJS.
            Libraries are independent. You can use SendGrid instead of Mailer,
            LemonSqueezy instead of Stripe, or Supabase instead of Pocketbase,
            for instance.
          </p>
        </div>
      </div>
      {/* What do I get exactly? */}
      <div className="collapse collapse-plus bg-base-200">
        <input type="radio" name="my-accordion-3" className="w-auto h-auto" />
        <div className="collapse-title text-xl font-medium">
          What do I get exactly?
        </div>
        <div className="collapse-content">
          <p>
            1/ The NextJS starter with all the boilerplate code you need to run
            an online business: a payment system, a database, login, a blog, UI
            components, and much more. The repo is available in: - Typescript -
            /app router and /pages router. 2/ The documentation helps you set up
            your app from scratch, write copy that sells, and ship fast. 3/
            Access to deployment templates to self host your app for free
          </p>
        </div>
      </div>
      {/* Is it a website template? */}
      <div className="collapse collapse-plus bg-base-200">
        <input type="radio" name="my-accordion-3" className="w-auto h-auto" />
        <div className="collapse-title text-xl font-medium">
          Is it a website template?
        </div>
        <div className="collapse-content">
          <p>
            It&apos;s more than just a template. You can copy/paste sections to
            build your site quickly, like a pricing section, an FAQ, and even an
            entire blog. You also get a bunch of UI components like buttons,
            modals, popovers, etc. The NextJS starter also comes with handy
            tools you need to run an online business—payment processing, emails,
            SEO, etc.
          </p>
        </div>
      </div>
      {/* How is FastPocket different from other boilerplates */}
      <div className="collapse collapse-plus bg-base-200">
        <input type="radio" name="my-accordion-3" className="w-auto h-auto" />
        <div className="collapse-title text-xl font-medium">
          Are there any other costs associated
        </div>
        <div className="collapse-content">
          <p>
            Many hosting platforms, like Vercel, let you host a project for free
            (front-end + back-end) and we give you Pocketbase templates to host
            your backend for free on Fly.io or PocketHost — so you can launch
            for first app for $0/month.
          </p>
        </div>
      </div>
      {/* How is FastPocket different from other boilerplates */}
      <div className="collapse collapse-plus bg-base-200">
        <input type="radio" name="my-accordion-3" className="w-auto h-auto" />
        <div className="collapse-title text-xl font-medium">
          How is FastPocket different from other boilerplates
        </div>
        <div className="collapse-content">
          <p>
            FastPocket is all about giving you control over how you host your
            app. You won't be locked into vendors when you scale and you get to
            choose how much or how little you spend. We give you deployment
            templates and hosting options (that you can migrate from when you
            grow)
          </p>
        </div>
      </div>
    </div>
    {/* End Accordion */}
    {/* End Col */}
  </div>
  {/* End Grid */}
</div>
```