Skip to content
A boilerplate for the 3x2 grid nerdpack design layout
CSS JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

3x2 grid layout design nerdpack

GitHub release (latest SemVer including pre-releases) Snyk

This nerdpack serves as a boilerplate for developers building on the New Relic One platform. In order to use this layout for your next project, follow the Getting started instructions below, and then replace the dummy content in nerdlet/index.js with your content.

What's included?

  • JSX to implement this layout.
  • CSS to improve the styling and provide some basic UX help.
  • Utility classes for things like making an element full width or full height.


This Nerdpack is a boilerplate for applications built on New Relic One; the best way to use it is to clone the repo whenever you're ready to start a new project. The idea is that the code that determines the layout has already been written, so you can replace the content inside of each section (toolbar, sidebar, primary-content) with the content that you have in mind for your project.

screenshot of this project

More boilerplate layout options

Open Source License

This project is distributed under the Apache 2 license.

What do you need to make this work?

Nothing! Just follow the getting started instructions below.

Getting started

  1. Ensure that you have Git and NPM installed. If you're unsure whether you have one or both of them installed, run the following commands. (If you have them installed, these commands will return a version number; if not, the commands won't be recognized.)
git --version
npm -v
  1. Install the NR1 CLI by going to this link and following the instructions (5 minutes or less) to install and set up your New Relic development environment.

  2. Run the following command to clone this repository, and run the code locally against your New Relic data:

nr1 nerdpack:clone -r
cd nr1-nerdpack-layout-3x2-grid
nr1 nerdpack:serve

Visit, navigate to the Nerdpack, and

Deploying this Nerdpack

Open a command prompt in the nerdpack's directory and run the following commands.

# If you need to create a new uuid for the account to which you're deploying this Nerdpack, use the following
# nr1 nerdpack:uuid -g [--profile=your_profile_name]
# to see a list of APIkeys / profiles available in your development environment, run nr1 credentials:list
nr1 nerdpack:publish [--profile=your_profile_name]
nr1 nerdpack:deploy [-c [DEV|BETA|STABLE]] [--profile=your_profile_name]
nr1 nerdpack:subscribe [-c [DEV|BETA|STABLE]] [--profile=your_profile_name]

Visit, navigate to the Nerdpack, and


New Relic has open-sourced this project. This project is provided AS-IS WITHOUT WARRANTY OR DEDICATED SUPPORT. Issues and contributions should be reported to the project here on GitHub.

We encourage you to bring your experiences and questions to the Explorers Hub where our community members collaborate on solutions and new ideas.


New Relic hosts and moderates an online forum where customers can interact with New Relic employees as well as other customers to get help and share best practices. Like all official New Relic open source projects, there's a related Community topic in the New Relic Explorers Hub. You can find this project's topic/threads here:

Issues / enhancement requests

Issues and enhancement requests can be submitted in the Issues tab of this repository. Please search for and review the existing open issues before submitting a new issue.


Contributions are welcome (and if you submit a Enhancement Request, expect to be invited to contribute it yourself 😁). Please review our Contributors Guide.

Keep in mind that when you submit your pull request, you'll need to sign the CLA via the click-through using CLA-Assistant. If you'd like to execute our corporate CLA, or if you have any questions, please drop us an email at

You can’t perform that action at this time.