init

.env.example

@@ -0,0 +1,2 @@
+DATABASE_URI=mongodb://127.0.0.1/payload-template-blank
+PAYLOAD_SECRET=YOUR_SECRET_HERE

.gitignore

@@ -0,0 +1,6 @@
+build
+dist
+/media
+node_modules
+.DS_Store
+.env

Dockerfile

@@ -0,0 +1,27 @@
+FROM node:18.8-alpine as base
+
+FROM base as builder
+
+WORKDIR /home/node/app
+COPY package*.json ./
+
+COPY . .
+RUN yarn install
+RUN yarn build
+
+FROM base as runtime
+
+ENV NODE_ENV=production
+ENV PAYLOAD_CONFIG_PATH=dist/payload.config.js
+
+WORKDIR /home/node/app
+COPY package*.json  ./
+COPY yarn.lock ./
+
+RUN yarn install --production
+COPY --from=builder /home/node/app/dist ./dist
+COPY --from=builder /home/node/app/build ./build
+
+EXPOSE 3000
+
+CMD ["node", "dist/server.js"]

README.md

@@ -0,0 +1,42 @@
+# Payload Blank Template
+
+A blank template for [Payload](https://github.com/payloadcms/payload) to help you get up and running quickly. This repo may have been created by running `npx create-payload-app@latest` and selecting the "blank" template or by cloning this template on [Payload Cloud](https://payloadcms.com/new/clone/blank).
+
+See the official [Examples Directory](https://github.com/payloadcms/payload/tree/main/examples) for details on how to use Payload in a variety of different ways.
+
+## Development
+
+To spin up the project locally, follow these steps:
+
+1. First clone the repo
+1. Then `cd YOUR_PROJECT_REPO && cp .env.example .env`
+1. Next `yarn && yarn dev` (or `docker-compose up`, see [Docker](#docker))
+1. Now Open [http://localhost:3000/admin](http://localhost:3000/admin)  to access the admin panel
+1. Create your first admin user using the form on the page
+
+That's it! Changes made in `./src` will be reflected in your app.
+
+### Docker
+
+Alternatively, you can use [Docker](https://www.docker.com) to spin up this project locally. To do so, follow these steps:
+
+1. Follow [steps 1 and 2 from above](#development), the docker-compose file will automatically use the `.env` file in your project root
+1. Next run `docker-compose up`
+1. Follow [steps 4 and 5 from above](#development) to login and create your first admin user
+
+That's it! The Docker instance will help you get up and running quickly while also standardizing the development environment across your teams.
+
+## Production
+
+To run Payload in production, you need to build and serve the Admin panel. To do so, follow these steps:
+
+1. First invoke the `payload build` script by running `yarn build` or `npm run build` in your project root. This creates a `./build` directory with a production-ready admin bundle.
+1. Then run `yarn serve` or `npm run serve` to run Node in production and serve Payload from the `./build` directory.
+
+### Deployment
+
+The easiest way to deploy your project is to use [Payload Cloud](https://payloadcms.com/new/import), a one-click hosting solution to deploy production-ready instances of your Payload apps directly from your GitHub repo. You can also deploy your app manually, check out the [deployment documentation](https://payloadcms.com/docs/production/deployment) for full details.
+
+## Questions
+
+If you have any issues or questions, reach out to us on [Discord](https://discord.com/invite/payload) or start a [GitHub discussion](https://github.com/payloadcms/payload/discussions).

docker-compose.yml

@@ -0,0 +1,28 @@
+version: "3"
+
+services:
+  payload:
+    image: node:18-alpine
+    ports:
+      - "3000:3000"
+    volumes:
+      - .:/home/node/app
+      - node_modules:/home/node/app/node_modules
+    working_dir: /home/node/app/
+    command: sh -c "yarn install && yarn dev"
+    depends_on:
+      - mongo
+    env_file:
+      - .env
+
+  mongo:
+    image: mongo:latest
+    ports:
+      - "27017:27017"
+    command:
+      - --storageEngine=wiredTiger
+    logging:
+      driver: none
+
+volumes:
+  node_modules:

nodemon.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "https://json.schemastore.org/nodemon.json",
+  "ext": "ts",
+  "exec": "ts-node src/server.ts -- -I",
+  "stdin": false
+}

package.json

@@ -0,0 +1,35 @@
+{
+  "name": "sharp-resolution-error-payload",
+  "description": "A blank template to get started with Payload",
+  "version": "1.0.0",
+  "main": "dist/server.js",
+  "license": "MIT",
+  "scripts": {
+    "dev": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts nodemon",
+    "build:payload": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload build",
+    "build:server": "tsc",
+    "build": "yarn copyfiles && yarn build:payload && yarn build:server",
+    "serve": "cross-env PAYLOAD_CONFIG_PATH=dist/payload.config.js NODE_ENV=production node dist/server.js",
+    "copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png}\" dist/",
+    "generate:types": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:types",
+    "generate:graphQLSchema": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:graphQLSchema",
+    "payload": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload"
+  },
+  "dependencies": {
+    "@payloadcms/bundler-webpack": "^1.0.0",
+    "@payloadcms/db-mongodb": "^1.0.0",
+    "@payloadcms/plugin-cloud": "^3.0.0",
+    "@payloadcms/richtext-slate": "^1.0.0",
+    "cross-env": "^7.0.3",
+    "dotenv": "^8.2.0",
+    "express": "^4.19.2",
+    "payload": "^2.0.0"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.9",
+    "copyfiles": "^2.4.1",
+    "nodemon": "^2.0.6",
+    "ts-node": "^9.1.1",
+    "typescript": "^4.8.4"
+  }
+}

src/collections/Media.ts

@@ -0,0 +1,45 @@
+import { CollectionConfig } from "payload/types"
+
+const Media: CollectionConfig = {
+    slug: "media",
+    admin: {
+        useAsTitle: "title"
+    },
+    access: {
+        read: () => true
+    },
+    upload: {
+        staticDir: "media",
+        staticURL: "/media",
+        imageSizes: [
+            {
+                name: "small",
+                width: 256,
+                height: undefined,
+                fit: "cover"
+            },
+            {
+                name: "medium",
+                width: 512,
+                height: undefined,
+                fit: "cover"
+            },
+            {
+                name: "large",
+                width: 1024,
+                height: undefined,
+                fit: "cover"
+            }
+        ],
+        mimeTypes: ["image/*", "video/*", "audio/*"]
+    },
+    fields: [
+        {
+            name: "title",
+            type: "text",
+            required: true
+        },
+    ]
+}
+
+export default Media

src/collections/Users.ts

@@ -0,0 +1,15 @@
+import { CollectionConfig } from 'payload/types'
+
+const Users: CollectionConfig = {
+  slug: 'users',
+  auth: true,
+  admin: {
+    useAsTitle: 'email',
+  },
+  fields: [
+    // Email added by default
+    // Add more fields as needed
+  ],
+}
+
+export default Users

src/local-upload.ts

@@ -0,0 +1,23 @@
+import { Payload } from "payload"
+
+export const migration = async (payload: Payload): Promise<void> => {
+
+    try {
+        await payload.create({
+            collection: "users",
+            data: {
+                email: "djkatovfx@gmail.com",
+                password: "changeme"
+            }
+        })
+    } catch (e) { }
+
+    payload.create({
+        collection: "media",
+        data: {
+            title: "Freeze Energysphere",
+        },
+        filePath: "./media/freeze energysphere.webp"
+    })
+
+}

src/payload.config.ts

@@ -0,0 +1,29 @@
+import path from 'path'
+
+import { payloadCloud } from '@payloadcms/plugin-cloud'
+import { mongooseAdapter } from '@payloadcms/db-mongodb'
+import { webpackBundler } from '@payloadcms/bundler-webpack'
+import { slateEditor } from '@payloadcms/richtext-slate'
+import { buildConfig } from 'payload/config'
+
+import Users from './collections/Users'
+import Media from './collections/Media'
+
+export default buildConfig({
+  admin: {
+    user: Users.slug,
+    bundler: webpackBundler(),
+  },
+  editor: slateEditor({}),
+  collections: [Users, Media],
+  typescript: {
+    outputFile: path.resolve(__dirname, 'payload-types.ts'),
+  },
+  graphQL: {
+    schemaOutputFile: path.resolve(__dirname, 'generated-schema.graphql'),
+  },
+  plugins: [payloadCloud()],
+  db: mongooseAdapter({
+    url: process.env.DATABASE_URI,
+  }),
+})

src/server.ts

@@ -0,0 +1,29 @@
+import express from 'express'
+import payload from 'payload'
+import { migration } from './local-upload'
+
+require('dotenv').config()
+const app = express()
+
+// Redirect root to Admin panel
+app.get('/', (_, res) => {
+  res.redirect('/admin')
+})
+
+const start = async () => {
+  // Initialize Payload
+  await payload.init({
+    secret: process.env.PAYLOAD_SECRET,
+    express: app,
+    onInit: async () => {
+      payload.logger.info(`Payload Admin URL: ${payload.getAdminURL()}`)
+      migration(payload)
+    },
+  })
+
+  // Add your own express routes here
+
+  app.listen(3000)
+}
+
+start()

tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "strict": false,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "jsx": "react",
+    "paths": {
+      "payload/generated-types": ["./src/payload-types.ts"],
+       "@/*": ["./src/*"]
+    }
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "dist", "build"],
+  "ts-node": {
+    "transpileOnly": true,
+    "swc": true
+  }
+}