npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

create-parallel-cms

v0.0.2

Published

[![Blitz.js](https://raw.githubusercontent.com/blitz-js/art/master/github-cover-photo.png)](https://blitzjs.com)

Downloads

5

Readme

Blitz.js

This is a Blitz.js app.

name

Getting Started

Run your app in the development mode.

blitz dev

Open http://localhost:3000 with your browser to see the result.

Environment Variables

Ensure the .env.local file has required environment variables:

DATABASE_URL=postgresql://<YOUR_DB_USERNAME>@localhost:5432/parallel-cms

Ensure the .env.test.local file has required environment variables:

DATABASE_URL=postgresql://<YOUR_DB_USERNAME>@localhost:5432/parallel-cms_test

Tests

Runs your tests using Jest.

yarn test

Blitz comes with a test setup using Vitest and react-testing-library.

Commands

Blitz comes with a powerful CLI that is designed to make development easy and fast. You can install it with npm i -g blitz

  blitz [COMMAND]

  dev       Start a development server
  build     Create a production build
  start     Start a production server
  export    Export your Blitz app as a static application
  prisma    Run prisma commands
  generate  Generate new files for your Blitz project
  console   Run the Blitz console REPL
  install   Install a recipe
  help      Display help for blitz
  test      Run project tests

You can read more about it on the CLI Overview documentation.

What's included?

Here is the starting structure of your app.

parallel-cms
├── src/
│   ├── api/
│   ├── auth/
│   │   ├── components/
│   │   │   ├── LoginForm.tsx
│   │   │   └── SignupForm.tsx
│   │   ├── mutations/
│   │   │   ├── changePassword.ts
│   │   │   ├── forgotPassword.test.ts
│   │   │   ├── forgotPassword.ts
│   │   │   ├── login.ts
│   │   │   ├── logout.ts
│   │   │   ├── resetPassword.test.ts
│   │   │   ├── resetPassword.ts
│   │   │   └── signup.ts
│   │   ├── pages/
│   │   │   ├── forgot-password.tsx
│   │   │   ├── login.tsx
│   │   │   ├── reset-password.tsx
│   │   │   └── signup.tsx
│   │   └── validations.ts
│   ├── core/
│   │   ├── components/
│   │   │   ├── Form.tsx
│   │   │   └── LabeledTextField.tsx
│   │   └── layouts/
│   │       └── Layout.tsx
│   ├── pages/
│   │   ├── _app.tsx
│   │   ├── _document.tsx
│   │   ├── 404.tsx
│   │   ├── index.test.tsx
│   │   └── index.tsx
│   └── users/
│       ├── hooks/
│       │   └── useCurrentUser.ts
│       └── queries/
│           └── getCurrentUser.ts
├── db/
│   ├── migrations/
│   ├── index.ts
│   ├── schema.prisma
│   └── seeds.ts
├── integrations/
├── mailers/
│   └── forgotPasswordMailer.ts
├── public/
│   ├── favicon.ico
│   └── logo.png
├── test/
│   ├── setup.ts
│   └── utils.tsx
├── .eslintrc.js
├── babel.config.js
├── blitz.config.ts
├── vitest.config.ts
├── package.json
├── README.md
├── tsconfig.json
└── types.ts

These files are:

  • The src/ folder is a container for most of your project. This is where you’ll put any pages or API routes.

  • db/ is where your database configuration goes. If you’re writing models or checking migrations, this is where to go.

  • public/ is a folder where you will put any static assets. If you have images, files, or videos which you want to use in your app, this is where to put them.

  • integrations/ is a folder to put all third-party integrations like with Stripe, Sentry, etc.

  • test/ is a folder where you can put test utilities and integration tests.

  • package.json contains information about your dependencies and devDependencies. If you’re using a tool like npm or yarn, you won’t have to worry about this much.

  • tsconfig.json is our recommended setup for TypeScript.

  • .babel.config.js, .eslintrc.js, .env, etc. ("dotfiles") are configuration files for various bits of JavaScript tooling.

  • blitz.config.ts is for advanced custom configuration of Blitz. Here you can learn how to use it.

  • vitest.config.ts contains config for Vitest tests. You can customize it if needed.

You can read more about it in the File Structure section of the documentation.

Tools included

Blitz comes with a set of tools that corrects and formats your code, facilitating its future maintenance. You can modify their options and even uninstall them.

  • ESLint: It lints your code: searches for bad practices and tell you about it. You can customize it via the .eslintrc.js, and you can install (or even write) plugins to have it the way you like it. It already comes with the blitz config, but you can remove it safely. Learn More.
  • Husky: It adds githooks, little pieces of code that get executed when certain Git events are triggerd. For example, pre-commit is triggered just before a commit is created. You can see the current hooks inside .husky/. If are having problems commiting and pushing, check out ther troubleshooting guide. Learn More.
  • Prettier: It formats your code to look the same everywhere. You can configure it via the .prettierrc file. The .prettierignore contains the files that should be ignored by Prettier; useful when you have large files or when you want to keep a custom formatting. Learn More.

Learn more

Read the Blitz.js Documentation to learn more.

The Blitz community is warm, safe, diverse, inclusive, and fun! Feel free to reach out to us in any of our communication channels.