tabshift/payloadcms
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

chore: readme updates (#1717)

Browse Source 
* refines readme banner image, badges and headings

* chore: spruce up README a bit more

* adds dark/light mode support for logo

Co-authored-by: Elliot DeNolf <denolfe@gmail.com>
This commit is contained in:
Sean Zubrickas
2022-12-20 09:28:12 -05:00
committed by GitHub
parent 60bb2652f0
commit d0dacdbde0
1 changed files with 78 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
README.md
View File

@@ -1,30 +1,82 @@
<h1 align="center">Payload</h1>
<p align="center">A free and open-source TypeScript headless CMS & application framework built with Express, MongoDB and React.</p>
<br />
<br />
<h1 align="center">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://cms.payloadcms.com/media/payload-github-logo-white.png">
<source media="(prefers-color-scheme: light)" srcset="https://cms.payloadcms.com/media/payload-github-logo.png">
<img alt="Payload CMS Logo" src="https://cms.payloadcms.com/media/payload-github-logo.png">
</picture>
</h1>
<h2 align="center" style="padding-bottom: 24px !important;">The most powerful TypeScript CMS</h2>
<p align="center">Code-first Headless CMS that bridges the gap between CMS and application framework</p>
<h3 align="center">
<br />
<a href="https://payloadcms.com/docs/getting-started/what-is-payload" rel="dofollow"><strong>Explore the docs »</strong></a>
<br />
<br/>
</h3>
<h4 align="center">
<a target="_blank" href="https://github.com/payloadcms/payload/discussions">Request Feature</a>
·
<a target="_blank" href="https://github.com/payloadcms/payload/issues/new?assignees=&labels=possible-bug&template=BUG_REPORT.md">Report Bug</a>
·
<a target="_blank" href="https://discord.com/invite/r6sCXqVk3v">Join Discord</a>
·
<a target="_blank" rel="dofollow" href="https://payloadcms.com/docs/getting-started/what-is-payload">Docs</a>
·
<a target="_blank" rel="dofollow" href="https://payloadcms.com/">Website</a>
</h4>
<br />
<p align="center">
<a href="https://opensource.org/licenses/MIT">
<img src="https://img.shields.io/badge/License-MIT-blue.svg" />
</a>
&nbsp;
<a href="https://github.com/payloadcms/payload/actions">
<img src="https://github.com/payloadcms/payload/workflows/build/badge.svg" />
</a>
<a href="https://www.npmjs.com/package/payload">
<img alt="npm" src="https://img.shields.io/npm/v/payload" />
&nbsp;
<a href="https://github.com/payloadcms/payload/commits">
<img src="https://img.shields.io/github/commit-activity/m/payloadcms/payload" alt="git commit activity"/>
</a>
<a href="https://twitter.com/intent/tweet?text=Payload%20-%20A%20self-hosted%2C%20headless%20JavaScript%20CMS%20%26%20application%20framework&url=https%3A%2F%2Fgithub.com%2Fpayloadcms%2Fpayload">
<img alt="Tweet Payload" src="https://img.shields.io/twitter/url/http/shields.io.svg?style=social" />
</a>
&nbsp;
<a href="https://discord.com/invite/r6sCXqVk3v">
<img alt="Discord" src="https://img.shields.io/discord/967097582721572934?label=Discord&color=7289da" />
</a>
&nbsp;
<a href="https://www.npmjs.com/package/payload">
<img alt="npm" src="https://img.shields.io/npm/v/payload" />
</a>
&nbsp;
<a href="https://twitter.com/payloadcms">
<img src="https://img.shields.io/twitter/follow/payloadcms?label=Follow" alt="Payload CMS Twitter" />
</a>
</p>
<br />
<a href="https://payloadcms.com">
<img src="https://payloadcms.com/images/og-image.jpg" alt="Payload headless CMS Admin panel built with React" />
<img src="https://cms.payloadcms.com/media/payload-github-header.jpg" alt="Payload headless CMS Admin panel built with React" />
</a>
### Features
<br />
## ⭐ Why Payload?
Payload is a CMS that has been designed for developers from the ground up to deliver them what they need to build great digital products. If you know JavaScript, you know Payload. It's a _code-first_ CMS, which allows us to do a lot of things right:
- Payload gives you everything you need, but then steps back and lets you build what you want in JavaScript or TypeScript - with no unnecessary complexity brought by GUIs. You'll understand how your CMS works because you will have written it exactly how you want it.
- Bring your own Express server and do whatever you need on top of Payload. Payload doesn't impose anything on you or your app.
- Completely control the Admin panel by using your own React components. Swap out fields or even entire views with ease.
- Use your data however and wherever you need thanks to auto-generated, yet fully extensible REST, GraphQL, and Local Node APIs.
## ✨ Features
- Completely free and open-source
- [GraphQL](https://payloadcms.com/docs/graphql/overview), [REST](https://payloadcms.com/docs/rest-api/overview), and [Local](https://payloadcms.com/docs/local-api/overview) APIs
@@ -44,41 +96,38 @@
- Intensely fast API
- Highly secure thanks to HTTP-only cookies, CSRF protection, and more
### Code-first
Payload is a CMS that has been designed for developers from the ground up to deliver them what they need to build great digital products. If you know JavaScript, you know Payload. It's a _code-first_ CMS, which allows us to do a lot of things right:
- Payload gives you everything you need, but then steps back and lets you build what you want in JavaScript or TypeScript - with no unnecessary complexity brought by GUIs. You'll understand how your CMS works because you will have written it exactly how you want it.
- Bring your own Express server and do whatever you need on top of Payload. Payload doesn't impose anything on you or your app.
- Completely control the Admin panel by using your own React components. Swap out fields or even entire views with ease.
- Use your data however and wherever you need thanks to auto-generated, yet fully extensible REST, GraphQL, and Local Node APIs.
### Quick Start
## 🚀 Quick Start
Before beginning to work with Payload, make sure you have all of the [required software](https://payloadcms.com/docs/getting-started/installation).
From there, the easiest way to get started with Payload is to use the `create-payload-app` package:
```
```text
npx create-payload-app
```
Alternatively, it only takes about five minutes to [create an app from scratch](https://payloadcms.com/docs/getting-started/installation#from-scratch).
### Documentation
## 🗒️ Documentation
Check out the [Payload website](https://payloadcms.com/docs/getting-started/what-is-payload) to find in-depth documentation for everything that Payload offers.
### Contributing
## 🙋 Contributing
If you want to add contributions to this repository, please follow the instructions in [contributing.md](./contributing.md).
### Other Resources
## 🚨 Need help?
##### Discussions
There are lots of good conversations and resources in our Github Discussions board & our Discord Server. If you're struggling with something, chances are, someone's already solved what you're up against. :point_down:
There are lots of good conversations and resources in our [GitHub Discussions board](https://github.com/payloadcms/payload/discussions). If you're struggling with something, chances are, someone's already solved what you're up against. Searching Discussions will often provide very helpful tips and tricks.
- [GitHub Discussions](https://github.com/payloadcms/payload/discussions)
- [GitHub Issues](https://github.com/payloadcms/payload/issues)
- [Discord](https://t.co/30APlsQUPB)
##### Discord
## ⭐ Like what we're doing? Give us a star
Join [Payload's Discord channel](https://discord.com/invite/r6sCXqVk3v) to interact with Payload developers in realtime.
![payload-github-star](https://cms.payloadcms.com/media/payload-github-star.gif)
## 👏 Thanks to all our contributors
<img align="left" src="https://contributors-img.web.app/image?repo=payloadcms/payload"/>