github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Home] Add instructions for APM on Cloud (#17163)

Browse source
This commit is contained in:
Søren Louv-Jansen 2018-03-19 15:36:24 +00:00 • committed by GitHub
parent 4ca65024ab
commit 791215584c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 196 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/core_plugins/kibana/public/home/components/__snapshots__/home.test.js.snap
View file

@ -6,7 +6,7 @@ exports[`directories should not render directory entry when showOnHomePage is fa
>
<AddData
addBasePath={[Function]}
isCloudEnabled={true}
apmUiEnabled={true}
/>
<EuiSpacer
size="l"
@ -109,7 +109,7 @@ exports[`directories should render ADMIN directory entry in "Manage" panel 1`] =
>
<AddData
addBasePath={[Function]}
isCloudEnabled={true}
apmUiEnabled={true}
/>
<EuiSpacer
size="l"
@ -230,7 +230,7 @@ exports[`directories should render DATA directory entry in "Explore Data" panel
>
<AddData
addBasePath={[Function]}
isCloudEnabled={true}
apmUiEnabled={true}
/>
<EuiSpacer
size="l"
@ -351,7 +351,7 @@ exports[`should not contain RecentlyAccessed panel when there is no recentlyAcce
>
<AddData
addBasePath={[Function]}
isCloudEnabled={true}
apmUiEnabled={true}
/>
<EuiSpacer
size="l"
@ -470,7 +470,7 @@ exports[`should render home component 1`] = `
</React.Fragment>
<AddData
addBasePath={[Function]}
isCloudEnabled={true}
apmUiEnabled={true}
/>
<EuiSpacer
size="l"

58
src/core_plugins/kibana/public/home/components/add_data.js
View file

@ -20,7 +20,7 @@ import {
EuiText,
} from '@elastic/eui';
export function AddData({ addBasePath, isCloudEnabled }) {
export function AddData({ addBasePath, apmUiEnabled }) {
const renderCards = () => {
const cardStyle = {
@ -29,40 +29,38 @@ export function AddData({ addBasePath, isCloudEnabled }) {
'border': 'none'
};
let apmCard;
if (!isCloudEnabled) {
apmCard = (
<KuiCard style={cardStyle}>
<KuiCardDescription>
<KuiCardDescriptionTitle>
<img
src={addBasePath('/plugins/kibana/assets/app_apm.svg')}
/>
<p>
APM
</p>
</KuiCardDescriptionTitle>
const getApmCard = () => (
<KuiCard style={cardStyle}>
<KuiCardDescription>
<KuiCardDescriptionTitle>
<img
src={addBasePath('/plugins/kibana/assets/app_apm.svg')}
/>
<p>
APM
</p>
</KuiCardDescriptionTitle>
<KuiCardDescriptionText>
APM automatically collects in-depth performance metrics and errors from inside your applications.
</KuiCardDescriptionText>
</KuiCardDescription>
<KuiCardDescriptionText>
APM automatically collects in-depth performance metrics and errors from inside your applications.
</KuiCardDescriptionText>
</KuiCardDescription>
<KuiCardFooter>
<EuiButton
href="#/home/tutorial/apm"
>
Add APM
</EuiButton>
</KuiCardFooter>
</KuiCard>
);
<KuiCardFooter>
<EuiButton
href="#/home/tutorial/apm"
>
Add APM
</EuiButton>
</KuiCardFooter>
</KuiCard>
);
}
return (
<div className="kuiVerticalRhythm">
<KuiCardGroup>
{apmCard}
{apmUiEnabled !== false && getApmCard()}
<KuiCard style={cardStyle}>
<KuiCardDescription>
@ -184,5 +182,5 @@ export function AddData({ addBasePath, isCloudEnabled }) {
AddData.propTypes = {
addBasePath: PropTypes.func.isRequired,
isCloudEnabled: PropTypes.bool.isRequired,
apmUiEnabled: PropTypes.bool.isRequired,
};

6
src/core_plugins/kibana/public/home/components/home.js
View file

@ -18,7 +18,7 @@ import {
import { FeatureCatalogueCategory } from 'ui/registry/feature_catalogue';
export function Home({ addBasePath, directories, isCloudEnabled, recentlyAccessed }) {
export function Home({ addBasePath, directories, apmUiEnabled, recentlyAccessed }) {
const renderDirectories = (category) => {
return directories
@ -58,7 +58,7 @@ export function Home({ addBasePath, directories, isCloudEnabled, recentlyAccesse
<AddData
addBasePath={addBasePath}
isCloudEnabled={isCloudEnabled}
apmUiEnabled={apmUiEnabled}
/>
<EuiSpacer size="l" />
@ -125,6 +125,6 @@ Home.propTypes = {
showOnHomePage: PropTypes.bool.isRequired,
category: PropTypes.string.isRequired
})),
isCloudEnabled: PropTypes.bool.isRequired,
apmUiEnabled: PropTypes.bool.isRequired,
recentlyAccessed: PropTypes.arrayOf(recentlyAccessedShape).isRequired,
};

10
src/core_plugins/kibana/public/home/components/home.test.js
View file

@ -16,7 +16,7 @@ test('should render home component', () => {
const component = shallow(<Home
addBasePath={addBasePath}
directories={[]}
isCloudEnabled={true}
apmUiEnabled={true}
recentlyAccessed={recentlyAccessed}
/>);
expect(component).toMatchSnapshot(); // eslint-disable-line
@ -26,7 +26,7 @@ test('should not contain RecentlyAccessed panel when there is no recentlyAccesse
const component = shallow(<Home
addBasePath={addBasePath}
directories={[]}
isCloudEnabled={true}
apmUiEnabled={true}
recentlyAccessed={[]}
/>);
expect(component).toMatchSnapshot(); // eslint-disable-line
@ -47,7 +47,7 @@ describe('directories', () => {
const component = shallow(<Home
addBasePath={addBasePath}
directories={[directoryEntry]}
isCloudEnabled={true}
apmUiEnabled={true}
recentlyAccessed={[]}
/>);
expect(component).toMatchSnapshot(); // eslint-disable-line
@ -67,7 +67,7 @@ describe('directories', () => {
const component = shallow(<Home
addBasePath={addBasePath}
directories={[directoryEntry]}
isCloudEnabled={true}
apmUiEnabled={true}
recentlyAccessed={[]}
/>);
expect(component).toMatchSnapshot(); // eslint-disable-line
@ -87,7 +87,7 @@ describe('directories', () => {
const component = shallow(<Home
addBasePath={addBasePath}
directories={[directoryEntry]}
isCloudEnabled={true}
apmUiEnabled={true}
recentlyAccessed={[]}
/>);
expect(component).toMatchSnapshot(); // eslint-disable-line

3
src/core_plugins/kibana/public/home/components/home_app.js
View file

@ -17,6 +17,7 @@ import { recentlyAccessedShape } from './recently_accessed';
export function HomeApp({ addBasePath, directories, recentlyAccessed }) {
const isCloudEnabled = chrome.getInjected('isCloudEnabled', false);
const apmUiEnabled = chrome.getInjected('apmUiEnabled', true);
const renderTutorialDirectory = (props) => {
return (
@ -65,7 +66,7 @@ export function HomeApp({ addBasePath, directories, recentlyAccessed }) {
<Home
addBasePath={addBasePath}
directories={directories}
isCloudEnabled={isCloudEnabled}
apmUiEnabled={apmUiEnabled}
recentlyAccessed={recentlyAccessed}
/>
</Route>

BIN
src/core_plugins/kibana/public/home/tutorial_resources/apm/apm.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 147 KiB

BIN
src/core_plugins/kibana/public/home/tutorial_resources/apm/apm_dashboard_transactions.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 335 KiB

109
src/core_plugins/kibana/server/tutorials/apm/apm_server_instructions.js
View file

@ -1,72 +1,97 @@
const EDIT_CONFIG = {
export const EDIT_CONFIG = {
title: 'Edit the configuration',
textPre: `If you're using an X-Pack secured version of Elastic Stack, you must specify` +
textPre:
`If you're using an X-Pack secured version of Elastic Stack, you must specify` +
' credentials in the `apm-server.yml` config file.',
commands: [
'output.elasticsearch:',
' hosts: ["<es_url>"]',
' username: <username>',
' password: <password>'
]
' password: <password>',
],
};
const IMPORT_DASHBOARD = {
title: 'Import dashboards',
textPre: 'APM Server ships with preconfigured dashboards.'
textPre: 'APM Server ships with preconfigured dashboards.',
};
const START_SERVER = {
title: 'Start APM Server',
textPre: 'The server processes and stores application performance metrics in Elasticsearch.'
textPre:
'The server processes and stores application performance metrics in Elasticsearch.',
};
export const DOWNLOAD_SERVER = {
title: 'Download and unpack APM Server',
export const IMPORT_DASHBOARD_UNIX = {
title: IMPORT_DASHBOARD.title,
textPre: IMPORT_DASHBOARD.textPre,
commands: ['./apm-server setup'],
};
export const UNIX_FAMILY_SERVER_INSTRUCTIONS = [
{
...IMPORT_DASHBOARD,
commands: [
'./apm-server setup'
]
},
EDIT_CONFIG,
{
...START_SERVER,
commands: [
'./apm-server -e'
]
}
];
export const START_SERVER_UNIX = {
title: START_SERVER.title,
textPre: START_SERVER.textPre,
commands: ['./apm-server -e'],
};
const DOWNLOAD_SERVER_TITLE = 'Download and unpack APM Server';
export const DOWNLOAD_SERVER_OSX = {
title: DOWNLOAD_SERVER_TITLE,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-darwin-x86_64.tar.gz',
'tar xzvf apm-server-6.2.0-darwin-x86_64.tar.gz',
'cd apm-server-6.2.0-darwin-x86_64/',
],
};
export const DOWNLOAD_SERVER_DEB = {
title: DOWNLOAD_SERVER_TITLE,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-amd64.deb',
'sudo dpkg -i apm-server-6.2.0-amd64.deb',
],
textPost:
'Looking for the 32-bit packages? See the [Download page]({config.docs.base_url}downloads/apm/apm-server).',
};
export const DOWNLOAD_SERVER_RPM = {
title: DOWNLOAD_SERVER_TITLE,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-x86_64.rpm',
'sudo rpm -vi apm-server-6.2.0-x86_64.rpm',
],
textPost:
'Looking for the 32-bit packages? See the [Download page]({config.docs.base_url}downloads/apm/apm-server).',
};
export const WINDOWS_SERVER_INSTRUCTIONS = [
{
...DOWNLOAD_SERVER,
textPre: '1. Download the APM Server Windows zip file from the [Download page](https://www.elastic.co/downloads/apm/apm-server).\n' +
'2. Extract the contents of the zip file into `C:\\Program Files`.\n' +
'3. Rename the `apm-server-6.2-windows` directory to `APM-Server`.\n' +
'4. Open a PowerShell prompt as an Administrator (right-click the PowerShell icon and select' +
' **Run As Administrator**). If you are running Windows XP, you might need to download and install PowerShell.\n' +
'5. From the PowerShell prompt, run the following commands to install APM Server as a Windows service:',
title: DOWNLOAD_SERVER_TITLE,
textPre:
'1. Download the APM Server Windows zip file from the [Download page](https://www.elastic.co/downloads/apm/apm-server).\n' +
'2. Extract the contents of the zip file into `C:\\Program Files`.\n' +
'3. Rename the `apm-server-6.2-windows` directory to `APM-Server`.\n' +
'4. Open a PowerShell prompt as an Administrator (right-click the PowerShell icon and select' +
' **Run As Administrator**). If you are running Windows XP, you might need to download and install PowerShell.\n' +
'5. From the PowerShell prompt, run the following commands to install APM Server as a Windows service:',
commands: [
`PS > cd 'C:\\Program Files\\APM-Server'`,
`PS C:\\Program Files\\APM-Server> .\\install-service-apm-server.ps1`
`PS C:\\Program Files\\APM-Server> .\\install-service-apm-server.ps1`,
],
textPost: 'Note: If script execution is disabled on your system, you need to set the execution policy for the current session' +
' to allow the script to run. For example: `PowerShell.exe -ExecutionPolicy UnRestricted -File .\\install-service-apm-server.ps1`.'
textPost:
'Note: If script execution is disabled on your system, you need to set the execution policy for the current session' +
' to allow the script to run. For example: `PowerShell.exe -ExecutionPolicy UnRestricted -File .\\install-service-apm-server.ps1`.',
},
{
...IMPORT_DASHBOARD,
commands: [
'apm-server.exe setup'
]
title: IMPORT_DASHBOARD.title,
textPre: IMPORT_DASHBOARD.textPre,
commands: ['apm-server.exe setup'],
},
EDIT_CONFIG,
{
...START_SERVER,
commands: [
'apm-server.exe -e'
]
}
title: START_SERVER.title,
textPre: START_SERVER.textPre,
commands: ['apm-server.exe -e'],
},
];

49
src/core_plugins/kibana/server/tutorials/apm/elastic_cloud.js Normal file
View file

@ -0,0 +1,49 @@
import { INSTRUCTION_VARIANT } from '../../../common/tutorials/instruction_variant';
import {
NODE_CLIENT_INSTRUCTIONS,
DJANGO_CLIENT_INSTRUCTIONS,
FLASK_CLIENT_INSTRUCTIONS,
RAILS_CLIENT_INSTRUCTIONS,
RACK_CLIENT_INSTRUCTIONS,
JS_CLIENT_INSTRUCTIONS,
} from './apm_client_instructions';
const SERVER_URL_INSTRUCTION = {
title: 'APM Server endpoint',
textPre: 'Retrieve the APM Server URL from your Elastic Cloud dashboard',
};
export const ELASTIC_CLOUD_INSTRUCTIONS = {
instructionSets: [
{
title: 'APM Agents',
instructionVariants: [
{
id: INSTRUCTION_VARIANT.NODE,
instructions: [SERVER_URL_INSTRUCTION, ...NODE_CLIENT_INSTRUCTIONS],
},
{
id: INSTRUCTION_VARIANT.DJANGO,
instructions: [SERVER_URL_INSTRUCTION, ...DJANGO_CLIENT_INSTRUCTIONS],
},
{
id: INSTRUCTION_VARIANT.FLASK,
instructions: [SERVER_URL_INSTRUCTION, ...FLASK_CLIENT_INSTRUCTIONS],
},
{
id: INSTRUCTION_VARIANT.RAILS,
instructions: [SERVER_URL_INSTRUCTION, ...RAILS_CLIENT_INSTRUCTIONS],
},
{
id: INSTRUCTION_VARIANT.RACK,
instructions: [SERVER_URL_INSTRUCTION, ...RACK_CLIENT_INSTRUCTIONS],
},
{
id: INSTRUCTION_VARIANT.JS,
instructions: [SERVER_URL_INSTRUCTION, ...JS_CLIENT_INSTRUCTIONS],
},
],
},
],
};

4
src/core_plugins/kibana/server/tutorials/apm/index.js
View file

@ -1,5 +1,6 @@
import { TUTORIAL_CATEGORY } from '../../../common/tutorials/tutorial_category';
import { ON_PREM_INSTRUCTIONS } from './on_prem';
import { ELASTIC_CLOUD_INSTRUCTIONS } from './elastic_cloud';
const apmIntro = 'Collect in-depth performance metrics and errors from inside your applications.';
@ -42,6 +43,7 @@ export function apmSpecProvider(server) {
euiIconType: 'apmApp',
artifacts: artifacts,
onPrem: ON_PREM_INSTRUCTIONS,
previewImagePath: '/plugins/kibana/home/tutorial_resources/apm/apm_dashboard_transactions.jpg',
elasticCloud: ELASTIC_CLOUD_INSTRUCTIONS,
previewImagePath: '/plugins/kibana/home/tutorial_resources/apm/apm.png',
};
}

79
src/core_plugins/kibana/server/tutorials/apm/on_prem.js
View file

@ -1,8 +1,12 @@
import { INSTRUCTION_VARIANT } from '../../../common/tutorials/instruction_variant';
import {
DOWNLOAD_SERVER,
WINDOWS_SERVER_INSTRUCTIONS,
UNIX_FAMILY_SERVER_INSTRUCTIONS
IMPORT_DASHBOARD_UNIX,
EDIT_CONFIG,
START_SERVER_UNIX,
DOWNLOAD_SERVER_RPM,
DOWNLOAD_SERVER_DEB,
DOWNLOAD_SERVER_OSX,
} from './apm_server_instructions';
import {
NODE_CLIENT_INSTRUCTIONS,
@ -21,79 +25,64 @@ export const ON_PREM_INSTRUCTIONS = {
{
id: INSTRUCTION_VARIANT.OSX,
instructions: [
{
...DOWNLOAD_SERVER,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-darwin-x86_64.tar.gz',
'tar xzvf apm-server-6.2.0-darwin-x86_64.tar.gz',
'cd apm-server-6.2.0-darwin-x86_64/',
]
},
...UNIX_FAMILY_SERVER_INSTRUCTIONS
]
DOWNLOAD_SERVER_OSX,
IMPORT_DASHBOARD_UNIX,
EDIT_CONFIG,
START_SERVER_UNIX,
],
},
{
id: INSTRUCTION_VARIANT.DEB,
instructions: [
{
...DOWNLOAD_SERVER,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-amd64.deb',
'sudo dpkg -i apm-server-6.2.0-amd64.deb',
],
textPost: 'Looking for the 32-bit packages? See the [Download page]({config.docs.base_url}downloads/apm/apm-server).'
},
...UNIX_FAMILY_SERVER_INSTRUCTIONS
]
DOWNLOAD_SERVER_DEB,
IMPORT_DASHBOARD_UNIX,
EDIT_CONFIG,
START_SERVER_UNIX,
],
},
{
id: INSTRUCTION_VARIANT.RPM,
instructions: [
{
...DOWNLOAD_SERVER,
commands: [
'curl -L -O https://artifacts.elastic.co/downloads/apm-server/apm-server-6.2.0-x86_64.rpm',
'sudo rpm -vi apm-server-6.2.0-x86_64.rpm'
],
textPost: 'Looking for the 32-bit packages? See the [Download page]({config.docs.base_url}downloads/apm/apm-server).'
},
...UNIX_FAMILY_SERVER_INSTRUCTIONS
]
DOWNLOAD_SERVER_RPM,
IMPORT_DASHBOARD_UNIX,
EDIT_CONFIG,
START_SERVER_UNIX,
],
},
{
id: INSTRUCTION_VARIANT.WINDOWS,
instructions: WINDOWS_SERVER_INSTRUCTIONS
}
]
instructions: WINDOWS_SERVER_INSTRUCTIONS,
},
],
},
{
title: 'APM Agents',
instructionVariants: [
{
id: INSTRUCTION_VARIANT.NODE,
instructions: NODE_CLIENT_INSTRUCTIONS
instructions: NODE_CLIENT_INSTRUCTIONS,
},
{
id: INSTRUCTION_VARIANT.DJANGO,
instructions: DJANGO_CLIENT_INSTRUCTIONS
instructions: DJANGO_CLIENT_INSTRUCTIONS,
},
{
id: INSTRUCTION_VARIANT.FLASK,
instructions: FLASK_CLIENT_INSTRUCTIONS
instructions: FLASK_CLIENT_INSTRUCTIONS,
},
{
id: INSTRUCTION_VARIANT.RAILS,
instructions: RAILS_CLIENT_INSTRUCTIONS
instructions: RAILS_CLIENT_INSTRUCTIONS,
},
{
id: INSTRUCTION_VARIANT.RACK,
instructions: RACK_CLIENT_INSTRUCTIONS
instructions: RACK_CLIENT_INSTRUCTIONS,
},
{
id: INSTRUCTION_VARIANT.JS,
instructions: JS_CLIENT_INSTRUCTIONS
}
]
}
]
instructions: JS_CLIENT_INSTRUCTIONS,
},
],
},
],
};