Skip to content

Commit 0802f14

Browse files
marcusgadbemmarcusgadbem
committed
(WIP) Small improvements
1 parent 96d7277 commit 0802f14

File tree

9 files changed

+201
-63
lines changed

9 files changed

+201
-63
lines changed

‎Azkfile.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
/**
2+
* Documentation: http://docs.azk.io/Azkfile.js
3+
*/
4+
// Adds the systems that shape your system
5+
systems({
6+
azkdemo: {
7+
// Dependent systems
8+
depends: ['redis'],
9+
// More images: http://images.azk.io
10+
image: {"docker": "azukiapp/node"},
11+
// Steps to execute before running instances
12+
provision: [
13+
"npm install",
14+
],
15+
workdir: "/azk/#{manifest.dir}",
16+
shell: "/bin/bash",
17+
command: "npm start",
18+
wait: 20,
19+
mounts: {
20+
'/azk/#{manifest.dir}': sync("."),
21+
'/azk/#{manifest.dir}/node_modules': persistent("./node_modules"),
22+
},
23+
scalable: {"default": 1},
24+
http: {
25+
domains: [ "#{system.name}.#{azk.default_domain}" ]
26+
},
27+
ports: {
28+
// exports global variables
29+
http: "3000/tcp",
30+
},
31+
envs: {
32+
// Make sure that the PORT value is the same as the one
33+
// in ports/http below, and that it's also the same
34+
// if you're setting it in a .env file
35+
NODE_ENV: "dev",
36+
PORT: "3000",
37+
},
38+
},
39+
// **ADD THE FOLLOWING, OUTSIDE OF THE AZKDEMO SYSTEM:**
40+
// Adds the "redis" system
41+
redis: {
42+
image: { docker: "redis" },
43+
export_envs: {
44+
"DATABASE_URL": "redis://#{net.host}:#{net.port[6379]}"
45+
}
46+
}
47+
});

‎index.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,8 @@ var layout;
2929

3030
// Route
3131
app.get('/', function(req, res) {
32-
layout = (req.locale == 'pt_BR') ? 'index_pt_br' : 'index_en';
32+
// layout = (req.locale == 'pt_BR') ? 'index_pt_br' : 'index_en';
33+
layout = "index_pt_br";
3334

3435
// fill `seq` with the container that processed the request
3536
azkInstanceData.seq = process.env.AZK_SEQ;
@@ -45,7 +46,7 @@ app.get('/', function(req, res) {
4546
client: true,
4647
counter: counter,
4748
azkData: azkInstanceData,
48-
step: 'commands'
49+
step: 'deployment'
4950
});
5051
})
5152
});

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@
1515
"dependencies": {
1616
"express": "3.4.4",
1717
"express-handlebars": "^2.0.1",
18-
"locale": "0.0.20"
18+
"locale": "0.0.20",
19+
"redis": "^2.4.2"
1920
},
2021
"devDependencies": {
2122
"nodemon": "^1.3.7"

‎public/assets/css/style.css

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ body {
1111
}
1212

1313
a {
14-
color: #31b4ce;
14+
color: #428BCA;
1515
text-decoration: none;
1616
}
1717

@@ -20,17 +20,17 @@ a:hover {
2020
}
2121

2222
a:visited {
23-
color: #9BD7E4;
23+
color: #2a6496;
2424
}
2525

2626
pre.request {
27-
color: silver;
27+
color: grey;
2828
}
2929

3030
.instance-id,
3131
.counter,
3232
.visitor {
33-
color: #31b4ce;
33+
color: #428BCA;
3434
}
3535

3636
/* steps */
@@ -48,8 +48,8 @@ ol.steps li {
4848

4949
.step-btn {
5050
display: block;
51-
border: 1px solid #38bcd4;
52-
color: #38bcd4;
51+
border: 1px solid #428BCA;
52+
color: #428BCA;
5353
font-size: 26px;
5454
font-weight: 100;
5555
padding: 12px;
@@ -59,7 +59,7 @@ ol.steps li {
5959
}
6060

6161
.step-btn--active {
62-
background: #38bcd4;
62+
background: #428BCA;
6363
color: #ffffff;
6464
}
6565

@@ -83,14 +83,14 @@ ol.steps li {
8383
padding: 0;
8484
}
8585

86-
.cmd-line li pre {
86+
.cmd-line li pre, .deployment pre, .database pre {
8787
background-color: #f7f7f7;
8888
border-radius: 3px;
8989
padding: 10px;
9090
}
9191

9292
.cmd-line--symbol {
93-
color: #31b4ce;
93+
color: #428BCA;
9494
}
9595

9696
.cmd-line--option {
@@ -114,7 +114,7 @@ ol.steps li {
114114
}
115115

116116
.azk-name {
117-
background: #31b4ce;
117+
background: #428BCA;
118118
border-top-left-radius: 999em;
119119
border-top-right-radius: 999em;
120120
border-bottom-right-radius: 999em;

‎views/index_pt_br.handlebars

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,20 +44,20 @@
4444
<p>Esperamos que você curta!</p>
4545

4646
<!-- if database client is not present -->
47-
{{#unless client}}
47+
{{#unless client}}
4848
<ol class="steps">
4949
<li><span class="step-btn step-btn--active">1. Banco de dados</span></li>
50-
<li><span class="step-btn step-btn--disabled">2. Outros Comandos</span></li>
50+
<li><span class="step-btn step-btn--disabled">2. Deployment</span></li>
5151
<!-- Load 'database' partial -->
5252
</ol>
53-
{{> database_pt_br }}
53+
{{> database_pt_br }}
5454
{{^}}
5555
<ol class="steps">
5656
<li><span class="step-btn">✓ Banco de dados</span></li>
57-
<li><span class="step-btn step-btn--active">2. Outros Comandos</span></li>
57+
<li><span class="step-btn step-btn--active">2. Deployment</span></li>
5858
<!-- Load 'commands' partial -->
5959
</ol>
60-
{{> commands_pt_br }}
60+
{{> deployment_pt_br }}
6161
{{/unless}}
6262

6363
<div class="h-line"> &nbsp; </div>

‎views/steps/commands_en.handlebars

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎views/steps/database_en.handlebars

Lines changed: 0 additions & 4 deletions
This file was deleted.

‎views/steps/database_pt_br.handlebars

Lines changed: 61 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,62 @@
1+
<div class="database">
2+
<h1>Adicione o banco de dados</h1>
3+
<p>Esta aplicação possui suporte a um simples contador de visitas mas, para vê-lo, é necessário adicionar um banco de dados Redis.</p>
4+
<p>Você pode plugar um banco de dados <a href="http://docs.azk.io/en/getting-started/database.html" target="_blank">seguindo estas instruções</a>.</p>
15

2-
<h2>1. Adicione o banco de dados</h2>
3-
<p>Esta aplicação possui suporte a um simples contador de visitas mas, para vê-lo, é necessário adicionar um banco de dados Redis.</p>
4-
<p>Você pode plugar um banco de dados <a href="http://docs.azk.io/en/getting-started/database.html" target="_blank">seguindo estas instruções</a>.</p>
6+
<ol>
7+
<li>Adicionar o redis no azkfile</li>
8+
<li>Iniciar o redis (azk start redis)</li>
9+
<li>Adicionar package 'redis' ao azkdemo (azk shell azkdemo; npm i redis --save)</li>
10+
<li>Adicionar redis como depends do azkdemo</li>
11+
<li>Restarta o azkdemo</li>
12+
</ol>
13+
14+
<div class="h-line"> &nbsp; </div>
15+
16+
<h2>1. Adicionando redis ao Azkfile.js</h2>
17+
<p> Add the following outside of <strong>azkdemo</strong> system:</p>
18+
19+
<pre><code> redis: {
20+
image: { docker: "redis" },
21+
export_envs: {
22+
"DATABASE_URL": "redis://#{net.host}:#{net.port[6379]}"
23+
}
24+
}
25+
</code></pre>
26+
27+
<div class="h-line"> &nbsp; </div>
28+
29+
<h2>2. Iniciando o Redis</h2>
30+
<pre> <span class="cmd-line--symbol">$</span> azk start <span class="cmd-line--option">redis</span></pre>
31+
32+
<div class="h-line"> &nbsp; </div>
33+
34+
<h2>3. Adicionar package redis a aplicação</h2>
35+
<pre>
36+
<span class="cmd-line--symbol">$</span> azk shell <span class="cmd-line--option">azkdemo</span>
37+
<span class="cmd-line--symbol">#</span> npm install <span class="cmd-line--option">redis</span> --save
38+
</pre>
39+
40+
<div class="h-line"> &nbsp; </div>
41+
42+
<h2>4. Adicionar redis como depends a aplicação no Azkfile</h2>
43+
<pre><code> systems({
44+
azkdemo: {
45+
// Dependent systems
46+
depends: ["redis"], // <= add the redis system
47+
// ...
48+
},
49+
redis: {
50+
// ...
51+
}
52+
});
53+
</code></pre>
54+
55+
<div class="h-line"> &nbsp; </div>
56+
57+
<h2>5. Restart a aplicação</h2>
58+
<pre>
59+
<span class="cmd-line--symbol">$</span> azk restart <span class="cmd-line--option">azkdemo</span>
60+
</pre>
61+
62+
</div>

‎views/steps/commands_pt_br.handlebars renamed to ‎views/steps/deployment_pt_br.handlebars

Lines changed: 73 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11

2+
<!--
23
<h2>Que tal tentar alguns outros comandos?</h2>
3-
44
<ul class="cmd-line">
55
<li>
66
<p>Mostra logs dos containers (<a href="http://docs.azk.io/pt-BR/reference/cli/logs.html" target="_blank">Ver doc</a>)</p>
7-
<pre><span class="cmd-line--symbol">$</span> azk logs <span class="cmd-line--option">[system name]</span> <span class="cmd-line--option">[--tail]</span></pre>
7+
<pre><span class="cmd-line--symbol">$</span> azk logs <span class="cmd-line--option">[system name]</span> <span class="cmd-line--option">[--follow]</span></pre>
88
</li>
99
<li>
1010
<p>Aumenta/diminui um sistema a uma [quantidade] de instâncias (<a href="http://docs.azk.io/pt-BR/reference/cli/scale.html" target="_blank">Ver docs</a>)</p>
@@ -21,6 +21,76 @@
2121
</ul>
2222
2323
<div class="h-line"> &nbsp; </div>
24+
-->
25+
<div class="deployment">
26+
27+
<h2>1. Configurando chaves SSH locais</h2>
28+
<p>O primeiro passo é configurar as chaves SSH em sua máquina. Elas vão ser úteis para fazermos a conexão ao droplet e para enviarmos os arquivos de seu projeto. Se você ainda não tem chaves SSH criadas em sua máquina (ou não tem certeza sobre isso), siga os passos 1 e 2 <a href="https://help.github.com/articles/generating-ssh-keys/" target="_blank">deste tutorial</a>.</p>
29+
30+
<div class="h-line"> &nbsp; </div>
31+
32+
<h2>2. Adicionar deploy ao Azkfile</h2>
33+
<pre><code> systems({
34+
// ...
35+
36+
deploy: {
37+
image: {"docker": "azukiapp/deploy-digitalocean"},
38+
mounts: {
39+
"/azk/deploy/src" : path("."),
40+
"/azk/deploy/.ssh": path("#{env.HOME}/.ssh"),
41+
"/azk/deploy/.config": persistent("deploy-config"),
42+
},
43+
scalable: {"default": 0, "limit": 0},
44+
},
45+
envs: {
46+
// Adicione aqui as opções de configuração do deploy
47+
}
48+
});
49+
</code></pre>
50+
51+
<div class="h-line"> &nbsp; </div>
52+
53+
<h2>3. Adicionar domínios a aplicação</h2>
54+
<p>Depois, adicione os seguintes http.domains ao seu sistema principal:</p>
55+
56+
<pre><code> systems({
57+
azkdemo: {
58+
// ...
59+
http: {
60+
domains: [
61+
"#{env.HOST_DOMAIN}",
62+
"#{env.HOST_IP}"
63+
// ...
64+
]
65+
},
66+
},
67+
68+
// ...
69+
});
70+
</code></pre>
71+
72+
<div class="h-line"> &nbsp; </div>
73+
74+
<h2>4. Gerar Token na DigitalOcean</h2>
75+
<p>Obtenha uma <a href="https://cloud.digitalocean.com/settings/applications" target="_blank">chave de acesso</a> (<em>personal access token</em> - precisa estar logado) da DigitalOcean.</p>
76+
77+
<div class="h-line"> &nbsp; </div>
78+
79+
<h2>5. Configurar variáveis de ambiente</h2>
80+
<p>Coloque-o em um arquivo chamado .env:</p>
81+
<pre> <span class="cmd-line--symbol">$</span> echo "DEPLOY_API_TOKEN=<span class="cmd-line--option">COLOQUE-SEU-TOKEN-AQUI</span>" >> .env</pre>
82+
83+
<div class="h-line"> &nbsp; </div>
84+
85+
<h2>6. Run deploy</h2>
86+
<pre> <span class="cmd-line--symbol">$</span> azk deploy</pre>
87+
88+
</div>
89+
90+
<!--
91+
<pre><code>
92+
</code></pre>
93+
<pre> <span class="cmd-line--symbol">$</span> azk start <span class="cmd-line--option">redis</span></pre>
2494
2595
<h2>Deseja ver alguns exemplos de aplicação mais complexas? <br>Veja os projetos abaixo rodando com <span class="azk-name">azk</span> :</h2>
2696
<ul class="projects">
@@ -34,3 +104,4 @@
34104
<a href="https://github.com/heitortsergent/feedbin" target="_blank">Feedbin</a> - Esta é uma aplicação mais complexa que utiliza Ruby/Rails, Postgres, Redis, ElasticSearch, Memcached, Sidekiq (sistema de fila de tarefas assíncrona) e Clockwork (performa tarefas agendadas).
35105
</li>
36106
</ul>
107+
-->

0 commit comments

Comments
 (0)