Community
Support chatroom
+
+ Contributing
+
Subscribe to our newsletter
diff --git a/microsite/data/plugins/api-docs.yaml b/microsite/data/plugins/api-docs.yaml
index b7f85b62b3..babcbf74f1 100644
--- a/microsite/data/plugins/api-docs.yaml
+++ b/microsite/data/plugins/api-docs.yaml
@@ -5,5 +5,5 @@ authorUrl: https://sda.se/
category: Discovery
description: Components to discover and display API entities as an extension to the catalog plugin.
documentation: https://github.com/spotify/backstage/blob/master/plugins/api-docs/README.md
-iconUrl: https://github.com/spotify/backstage/raw/master/plugins/api-docs/docs/entity_tab_api.png
+iconUrl: https://thecoders.io/wp-content/uploads/2019/11/tech-swagger.svg
npmPackageName: '@backstage/plugin-api-docs'
diff --git a/microsite/data/plugins/circleci.yaml b/microsite/data/plugins/circleci.yaml
index c8a3677614..6937064815 100644
--- a/microsite/data/plugins/circleci.yaml
+++ b/microsite/data/plugins/circleci.yaml
@@ -5,5 +5,5 @@ authorUrl: https://www.spotify.com/
category: CI
description: Automate your development process with CI hosted in the cloud or on a private server.
documentation: https://github.com/spotify/backstage/tree/master/plugins/circleci
-iconUrl: https://d3r49iyjzglexf.cloudfront.net/logo-wordmark-26f8eaea9b0f6e13b90d3f4a8fd8fda31490f5af41daab98bbede45037682576.svg
+iconUrl: https://www.saaves.com/storage/brochure/logo-circleci-icon1583764538.png
npmPackageName: '@backstage/plugin-circleci'
diff --git a/microsite/data/plugins/github-actions.yaml b/microsite/data/plugins/github-actions.yaml
new file mode 100644
index 0000000000..b384980b2a
--- /dev/null
+++ b/microsite/data/plugins/github-actions.yaml
@@ -0,0 +1,13 @@
+---
+title: GitHub Actions
+author: Spotify
+authorUrl: https://www.spotify.com/
+category: CI
+description: GitHub Actions makes it easy to automate all your software workflows, now with world-class CI/CD. Build, test, and deploy your code right from GitHub.
+documentation: https://github.com/spotify/backstage/tree/master/plugins/github-actions
+iconUrl: https://avatars2.githubusercontent.com/u/44036562?s=400&v=4
+npmPackageName: '@backstage/plugin-github-actions'
+tags:
+ - ci
+ - cd
+ - github
diff --git a/microsite/data/plugins/tech-radar.yaml b/microsite/data/plugins/tech-radar.yaml
index a20667e8f0..585e204b12 100644
--- a/microsite/data/plugins/tech-radar.yaml
+++ b/microsite/data/plugins/tech-radar.yaml
@@ -5,5 +5,5 @@ authorUrl: https://www.spotify.com/
category: Discovery
description: Visualize the your company's official guidelines of different areas of software development.
documentation: https://github.com/spotify/backstage/tree/master/plugins/tech-radar
-iconUrl: https://github.com/spotify/backstage/raw/master/plugins/tech-radar/docs/screenshot.png
+iconUrl: https://img.icons8.com/officel/2x/radar.png
npmPackageName: '@backstage/plugin-tech-radar'
diff --git a/microsite/pages/en/index.js b/microsite/pages/en/index.js
index 986db4b732..7a58ede25f 100644
--- a/microsite/pages/en/index.js
+++ b/microsite/pages/en/index.js
@@ -455,12 +455,8 @@ class Index extends React.Component {
Share with the community
- Building{' '}
-
- open source plugins
- {' '}
- contributes to the entire Backstage ecosystem, which benefits
- everyone
+ Building open source plugins contributes
+ to the entire Backstage ecosystem, which benefits everyone
@@ -472,7 +468,7 @@ class Index extends React.Component {
Build a plugin
-
+
Contribute
diff --git a/microsite/pages/en/plugins.js b/microsite/pages/en/plugins.js
index 916f34c21e..8c5f017e24 100644
--- a/microsite/pages/en/plugins.js
+++ b/microsite/pages/en/plugins.js
@@ -29,13 +29,14 @@ const Plugins = () => (
@@ -69,13 +70,44 @@ const Plugins = () => (
className="PluginCardLink ButtonFilled"
href={documentation}
>
- docs
+ Explore
),
)}
+
+
+
+ Do you have an existing plugin that you want to add to the
+ Marketplace?
+
+
+
+ Add to marketplace
+
+
+
+
+
+ See what plugins are already{' '}
+
+ in progress
+ {' '}
+ and ๐. Missing a plugin for your favorite tool? Please{' '}
+
+ suggest
+ {' '}
+ a new one.
+
+
+
diff --git a/microsite/static/css/plugins.css b/microsite/static/css/plugins.css
index 042e2954e1..96fe3dac35 100644
--- a/microsite/static/css/plugins.css
+++ b/microsite/static/css/plugins.css
@@ -1,111 +1,112 @@
.PluginCard {
- background-color: #272822;
- height: 100%;
- padding: 16px;
- display: flex;
- flex-direction: column;
+ background-color: #272822;
+ height: 100%;
+ padding: 16px;
+ display: flex;
+ flex-direction: column;
}
.grid {
- display: grid;
- grid-gap: 1rem;
- grid-template-columns: repeat(4, 1fr);
- grid-auto-rows: 1fr;
- padding-top: 32px;
+ display: grid;
+ grid-gap: 1rem;
+ grid-template-columns: repeat(4, 1fr);
+ grid-auto-rows: 1fr;
+ padding-top: 32px;
}
@media (max-width: 1200px) {
- .grid {
- grid-template-columns: repeat(3, 1fr);
- }
+ .grid {
+ grid-template-columns: repeat(3, 1fr);
+ }
}
@media only screen and (max-width: 815px) {
- .grid {
- grid-template-columns: repeat(2, 1fr);
- }
+ .grid {
+ grid-template-columns: repeat(2, 1fr);
+ }
}
.PluginCard img {
- float: left;
- margin: 0px 16px 8px 0px;
- height: 100px;
- width: 100px;
+ float: left;
+ margin: 0px 16px 8px 0px;
+ height: 80px;
+ width: 80px;
}
.PluginCardHeader {
- max-height: fit-content;
- min-height: fit-content;
+ max-height: fit-content;
+ min-height: fit-content;
}
.PluginCardTitle {
- color: white;
- vertical-align: top;
- margin: 8px 0px 0px 16px;
+ color: white;
+ vertical-align: top;
+ margin: 8px 0px 0px 16px;
}
.PluginAddNewButton {
- position: absolute;
- bottom: 16px;
- right: 0px;
+ position: absolute;
+ bottom: 16px;
+ right: 0px;
}
.ButtonFilled {
- padding: 4px 8px;
- border-radius: 4px;
- background-color: #36BAA2;
- color: white;
- margin-top: 36px;
+ padding: 4px 8px;
+ border-radius: 4px;
+ background-color: #36baa2;
+ color: white;
+ margin-top: 36px;
}
.ButtonFilled:hover {
- border: 1px solid #36BAA2;
- background-color: transparent;
+ border: 1px solid #36baa2;
+ background-color: transparent;
}
.ChipOutlined {
- font-size: small;
- border-radius: 16px;
- padding: 2px 8px;
- border: 1px solid #36BAA2;
- color: #36BAA2;
+ font-size: small;
+ border-radius: 16px;
+ padding: 2px 8px;
+ border: 1px solid #36baa2;
+ color: #36baa2;
}
.PluginCardLink {
- padding: 2px 8px;
- position: absolute;
- bottom: 0;
- right: 0;
+ padding: 2px 8px;
+ position: absolute;
+ bottom: 0;
+ right: 0;
}
.PluginPageLayout {
- margin: auto;
- max-width: 1430px;
- padding: 20px;
+ margin: auto;
+ max-width: 1430px;
+ padding: 20px;
}
.PluginPageHeader {
- position: relative;
+ position: relative;
}
.PluginPageHeader h2 {
- display: inline-block;
+ display: inline-block;
}
.PluginCardBody {
- padding-top: 8px;
+ padding-top: 8px;
}
.PluginCardFooter {
- position: relative;
- min-height: 2em;
+ position: relative;
+ min-height: 2em;
}
-.Author, .Author a {
- margin-bottom: 0.25em;
- color: rgba(255,255,255, 0.6);
+.Author,
+.Author a {
+ margin-bottom: 0.25em;
+ color: rgba(255, 255, 255, 0.6);
}
- .Author a:hover {
- color: white;
+.Author a:hover {
+ color: white;
}
diff --git a/packages/app/package.json b/packages/app/package.json
index 11e900a4f1..e017a6f322 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -2,6 +2,7 @@
"name": "example-app",
"version": "0.1.1-alpha.20",
"private": true,
+ "bundled": true,
"dependencies": {
"@backstage/cli": "^0.1.1-alpha.20",
"@backstage/catalog-model": "^0.1.1-alpha.20",
diff --git a/packages/backend-common/package.json b/packages/backend-common/package.json
index 92d301d7e3..248e638ead 100644
--- a/packages/backend-common/package.json
+++ b/packages/backend-common/package.json
@@ -46,7 +46,8 @@
"prom-client": "^12.0.0",
"selfsigned": "^1.10.7",
"stoppable": "^1.1.0",
- "winston": "^3.2.1"
+ "winston": "^3.2.1",
+ "logform": "^2.1.1"
},
"peerDependencies": {
"pg-connection-string": "^2.3.0"
diff --git a/packages/backend-common/src/index.ts b/packages/backend-common/src/index.ts
index f499613851..c527f5fea1 100644
--- a/packages/backend-common/src/index.ts
+++ b/packages/backend-common/src/index.ts
@@ -20,4 +20,5 @@ export * from './errors';
export * from './logging';
export * from './middleware';
export * from './service';
+export * from './paths';
export * from './hot';
diff --git a/packages/backend-common/src/logging/formats.ts b/packages/backend-common/src/logging/formats.ts
new file mode 100644
index 0000000000..5f00448744
--- /dev/null
+++ b/packages/backend-common/src/logging/formats.ts
@@ -0,0 +1,35 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as winston from 'winston';
+import { TransformableInfo } from 'logform';
+
+const coloredTemplate = (info: TransformableInfo) => {
+ const { timestamp, level, message, plugin, service } = info;
+ const colorizer = winston.format.colorize();
+ const prefix = plugin || service;
+ const timestampColor = colorizer.colorize('timestamp', timestamp);
+ const prefixColor = colorizer.colorize('prefix', prefix);
+
+ return `${timestampColor} ${prefixColor} ${level} ${message}`;
+};
+
+export const coloredFormat = winston.format.combine(
+ winston.format.timestamp(),
+ winston.format.colorize({
+ colors: { timestamp: 'dim', prefix: 'blue' },
+ }),
+ winston.format.printf(coloredTemplate),
+);
diff --git a/packages/backend-common/src/logging/rootLogger.ts b/packages/backend-common/src/logging/rootLogger.ts
index fd2f3a1c8b..306ed23444 100644
--- a/packages/backend-common/src/logging/rootLogger.ts
+++ b/packages/backend-common/src/logging/rootLogger.ts
@@ -14,17 +14,14 @@
* limitations under the License.
*/
import * as winston from 'winston';
+import { coloredFormat } from './formats';
let rootLogger: winston.Logger = winston.createLogger({
level: process.env.LOG_LEVEL || 'info',
format:
process.env.NODE_ENV === 'production'
? winston.format.json()
- : winston.format.combine(
- winston.format.colorize(),
- winston.format.timestamp(),
- winston.format.simple(),
- ),
+ : coloredFormat,
defaultMeta: { service: 'backstage' },
transports: [
new winston.transports.Console({
diff --git a/packages/backend-common/src/paths.ts b/packages/backend-common/src/paths.ts
new file mode 100644
index 0000000000..402c0e2252
--- /dev/null
+++ b/packages/backend-common/src/paths.ts
@@ -0,0 +1,36 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable @typescript-eslint/camelcase */
+
+import { resolve as resolvePath } from 'path';
+
+/**
+ * Resolve a path relative to the root of a package directory.
+ * Additional path arguments are resolved relative to the package dir.
+ *
+ * This is particularly useful when you want to access assets shipped with
+ * your backend plugin package. When doing so, do not forget to include the assets
+ * in your published package by adding them to `files` in your `package.json`.
+ */
+export function resolvePackagePath(name: string, ...paths: string[]) {
+ const req =
+ typeof __non_webpack_require__ === 'undefined'
+ ? require
+ : __non_webpack_require__;
+
+ return resolvePath(req.resolve(`${name}/package.json`), '..', ...paths);
+}
diff --git a/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts b/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts
index df69387e40..10f9ca4d9b 100644
--- a/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts
+++ b/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts
@@ -135,7 +135,6 @@ export class ServiceBuilderImpl implements ServiceBuilder {
app.use(cors(corsOptions));
}
app.use(compression());
- app.use(express.json());
if (this.enableMetrics) {
app.use(metricsHandler());
}
diff --git a/packages/backend/package.json b/packages/backend/package.json
index 7393ede81e..a2a9e41a92 100644
--- a/packages/backend/package.json
+++ b/packages/backend/package.json
@@ -46,6 +46,6 @@
"@types/dockerode": "^2.5.32",
"@types/express": "^4.17.6",
"@types/express-serve-static-core": "^4.17.5",
- "@types/helmet": "^0.0.47"
+ "@types/helmet": "^0.0.48"
}
}
diff --git a/packages/cli/src/commands/create-plugin/createPlugin.ts b/packages/cli/src/commands/create-plugin/createPlugin.ts
index 47b883882b..5e6882a4a0 100644
--- a/packages/cli/src/commands/create-plugin/createPlugin.ts
+++ b/packages/cli/src/commands/create-plugin/createPlugin.ts
@@ -28,6 +28,7 @@ import {
} from '../../lib/codeowners';
import { paths } from '../../lib/paths';
import { Task, templatingTask } from '../../lib/tasks';
+import { version as backstageVersion } from '../../lib/version';
const exec = promisify(execCb);
@@ -239,7 +240,11 @@ export default async () => {
await createTemporaryPluginFolder(tempDir);
Task.section('Preparing files');
- await templatingTask(templateDir, tempDir, { ...answers, version });
+ await templatingTask(templateDir, tempDir, {
+ ...answers,
+ version,
+ backstageVersion,
+ });
Task.section('Moving to final location');
await movePlugin(tempDir, pluginDir, answers.id);
diff --git a/packages/cli/src/commands/plugin/diff.ts b/packages/cli/src/commands/plugin/diff.ts
index 66db692ab4..99af093f2c 100644
--- a/packages/cli/src/commands/plugin/diff.ts
+++ b/packages/cli/src/commands/plugin/diff.ts
@@ -25,7 +25,7 @@ import {
yesPromptFunc,
} from '../../lib/diff';
import { paths } from '../../lib/paths';
-import { version } from '../../lib/version';
+import { version as backstageVersion } from '../../lib/version';
export type PluginData = {
id: string;
@@ -62,9 +62,12 @@ export default async (cmd: Command) => {
promptFunc = yesPromptFunc;
}
+ const { version } = await fs.readJson(paths.resolveTargetRoot('lerna.json'));
+
const data = await readPluginData();
const templateFiles = await diffTemplateFiles('default-plugin', {
version,
+ backstageVersion,
...data,
});
await handleAllFiles(fileHandlers, templateFiles, promptFunc);
diff --git a/packages/cli/src/commands/testCommand.ts b/packages/cli/src/commands/testCommand.ts
index 9969aee3b4..2c3f9fe895 100644
--- a/packages/cli/src/commands/testCommand.ts
+++ b/packages/cli/src/commands/testCommand.ts
@@ -57,6 +57,12 @@ export default async (cmd: Command) => {
}
}
+ // This is the only thing that is not implemented by jest.run(), so we do it here instead
+ // https://github.com/facebook/jest/blob/cd8828f7bbec6e55b4df5e41e853a5133c4a3ee1/packages/jest-cli/bin/jest.js#L12
+ if (!process.env.NODE_ENV) {
+ (process.env as any).NODE_ENV = 'test';
+ }
+
// eslint-disable-next-line jest/no-jest-import
await require('jest').run(args);
};
diff --git a/packages/cli/src/lib/bundler/backend.ts b/packages/cli/src/lib/bundler/backend.ts
index f5f233854f..e3cc8af8d1 100644
--- a/packages/cli/src/lib/bundler/backend.ts
+++ b/packages/cli/src/lib/bundler/backend.ts
@@ -25,7 +25,7 @@ export async function serveBackend(
},
) {
const paths = resolveBundlingPaths(options);
- const config = createBackendConfig(paths, {
+ const config = await createBackendConfig(paths, {
...options,
isDev: true,
});
diff --git a/packages/cli/src/lib/bundler/config.ts b/packages/cli/src/lib/bundler/config.ts
index 61f4448dd9..118cb1b40c 100644
--- a/packages/cli/src/lib/bundler/config.ts
+++ b/packages/cli/src/lib/bundler/config.ts
@@ -15,6 +15,7 @@
*/
import fs from 'fs-extra';
+import { resolve as resolvePath } from 'path';
import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import ModuleScopePlugin from 'react-dev-utils/ModuleScopePlugin';
@@ -171,14 +172,23 @@ export async function createConfig(
};
}
-export function createBackendConfig(
+export async function createBackendConfig(
paths: BundlingPaths,
options: BackendBundlingOptions,
-): webpack.Configuration {
+): Promise