Big news from Last Call Media: we’ve built a Next.js project template that helps developers spend less time setting up and more time building great stuff. And it’s open source!
The world of web development is flush with libraries, frameworks, and tools all promising to be flashy, modern and efficient. Devs are spoiled for choice — and sometimes a little overwhelmed by it. Meeting user expectations means offering the latest capabilities. But evaluating technologies properly means extensive research and testing, which pulls time away from new projects.
We think it should be simpler to spin up a site. So we’ve made it that way. How? With our own Next.js project code base: a modern framework built with the latest tech stacks, guaranteed to work out-of-the-box.
You can start building straight away in this pre-created environment (because we’ve already done comprehensive testing and integration.) Anyone can use it, from seasoned devs to website hobbyists. It has everything you’d expect, like testing suites, accessibility features, and mobile-first design principles. Oh — and it’s completely free. Our treat.
Wanna get started? Skip ahead to installation, or keep reading for more.
The QuickStart tech stack
Our goal is to get developers up and running ASAP so they can build what developers need without having to start from the ground up. Taking inspiration from other projects like T3 and Next.js Boilerplate, our tech stack aims to be comprehensive and flexible, focusing on using up-to-date development tools like:
- Next.js web framework for mobile-ready design optimization.
- Custom React components with LCM’s unique look and feel.
- tRPC integration for quick CRUD development using type-safe designs.
- Prisma and Postgres for all your database and storage needs.
- NextAuth for built-in OAuth 2.0 integration with Google provider.
- I18n message internationalization for multi-language support
We even added a built in dark-mode for you to use! Your eyes will thank you.
Why LCM QuickStart vs alternatives?
When we started working with Next.js, we wanted a template project for internal use. It needed to contain everything required to create a website that met our standards. We looked at several existing projects to get us started, including T3 and Next.js Boilerplate — but our developers kept wanting more. There was either not enough explanation for how code libraries worked or why they were chosen, or there were missing features that compromised our coding ethics and expectations.
In the end, we opted to create our own code suite. One capable of spinning up production-ready websites that guarantee the standards of safety, best practices, and accessibility that our customers have come to expect. Quickstart provides the best of the projects we pulled inspiration from, while adding accessibility testing, message internationalization, and future-proofing ourselves for upcoming AI Agent innovations.
For experts and newbies
Different developers care about different things. Seasoned pros care more about flexibility in design, and controlling what goes into their projects. New devs who want a more streamlined approach often need something that works out-of-the-box and handles the details.
Quickstart is designed to provide the best of both worlds. It lets developers of any skill level get started quickly and safely, while providing the flexibility and customization to create unique solutions.
LCM Quickstart eases the coding experience in a few important ways:
- Full typing using Typescript with strict configurations, so variable types never get confused and functions always know what data structures they get.
- Automated code formatting with ESLint and Prettier, to ensure things look as clean and readable as possible.
- Baked in Accessibility testing with axe-core, just like we promised.
- Containerization with Docker, making sure it always works on every machine, and preventing other projects from accidentally crossing the streams.
There’s also a focus on mobile-first development practices in all of our code. No need to make separate pages and components for mobile browsers — create pages once, properly, and never worry about them again.
Documentation for everything
Want to learn how something works? Curious about a new framework but never used it before? Our comprehensive LCM QuickStart documentation provides all the knowledge you’ll need to grok a new technology quickly, so you can start working with it the right way.
- Building proper data models with Prisma
- Deploying like a pro using Docker
- Testing for accessibility scripts
- CSS styling the easy way with Tailwind
- All the documentation links right where you need ’em
Our biggest push was to provide solid examples for developers to work from when using these toolkits. Even senior developers have to start somewhere when using new libraries, so we’ve created concise and clear explanations for everything we use.
Want to quickly get started and just need the command lines? They’re right there in the opener for each README.
Trying to write code but need a concrete example? We provide several code snippets for each method, including line-by-line explanations where we can.
Need to dive into further reading on how a library works? Links to their doc pages are provided so you can jump straight in.
Whenever we ran into something we needed while building our Next.js projects, we documented it thoroughly, ensuring anyone can step in and figure things out fast.
Tools for the future
We’re committed to incorporating the latest technologies for developers to explore and play with. Future rollouts are set to include popular AI toolsets for web development, like MCP servers, AI Agent communications, CopilotKit and Pickaxe support — along with all the proper documentation and explanations for them.
LLMs are a big part of the tech landscape that we can’t ignore. Our goal is to ensure websites can tap into safe, proven innovations that genuinely help customers (like Massachusetts’ AI-driven chatbot, which we helped upgrade.) Our continuous work on Quickstart includes adding the right tools and file structures so your site can easily integrate with the emerging Agentic AI tools being implemented by big platforms like Azure and AWS.
There’s still a lot of work we want to do on LCM QuickStart. And we’ll keep finding more, because it’s our way of staying on the bleeding-edge of technology.
Tech specs for the devs
Skipping right to the good stuff? We got you covered. Here’s how to get up and running in 5 minutes or less.
Prerequisites
Installation
git clone https://github.com/LastCallMedia/lcm-nextjs-boilerplate.git
cd lcm-nextjs-boilerplate
pnpm install
Set up environment variables:
cp .env.example .env
# Edit .env with your configuration
Setup your database:
Start the database
pnpm docker:dev
Initialize the database
Pnpm db:generate
Start development server:
pnpm dev
Instructions are written in README.md file.
Want to know more?
Go to our Github project page to get started.
Or jump straight to the Installation instructions for even more information on setup and preparation.
And if you’re a seasoned developer who wants to help, our Contribution Guide will get you up to speed so you can do your part pushing code, reporting issues, and making feature requests everyone will love.
