diff --git a/source/index.md b/source/index.md index 7055401aca2212e823126231ea25d1b8118ef8fc..c992935bfc80c7607da354d65f24435f7eb9fecf 100644 --- a/source/index.md +++ b/source/index.md @@ -1,4 +1,4 @@ -# Documentação de exemplo +# Documentação CMS C3SL ```{toctree} :maxdepth: 2 diff --git a/source/pages/arquitetura_cms.jpg b/source/pages/arquitetura_cms.jpg new file mode 100644 index 0000000000000000000000000000000000000000..2253c3b868d97d0865079c7555ed4c06b1eb9234 Binary files /dev/null and b/source/pages/arquitetura_cms.jpg differ diff --git a/source/pages/arquitetura_cms.md b/source/pages/arquitetura_cms.md new file mode 100644 index 0000000000000000000000000000000000000000..ec348c604e95859f2c8f9a9756f14eabca33f52c --- /dev/null +++ b/source/pages/arquitetura_cms.md @@ -0,0 +1,58 @@ + +# Arquitetura do projeto site C3SL + +## Componentes: +- VM +- Strapi +- Hugo +- Nginx (Hugo e Strapi) +- Postgresql +- Systemd +- DNS +- CNAME strapi.c3sl.ufpr.br +- CNAME cms.c3sl.ufpr.br + +## VM CMS (Máquina virtual) +É um ambiente/servidor, o qual possui as aplicações que queremos executar e disponibilizá-las para acesso externo. + +## Strapi: +Strapi é o CMS (Serviço de gerenciamento de conteúdo), o qual usamos para comunicar com o site baseado no framework Hugo por meio de uma interface gráfica. O objetivo é usá-lo para facilitar o serviço do time de comunicação ao postarem notícias no site do C3SL. +Internamente, o strapi possui uma configuração de lifecycles, o qual é possivel executar ações conforme algum tipo de evento acontece (publicar/deletar uma notícia). Uma dessas ações é transformar o conteúdo da notícia em um arquivo markdown que será salvo dentro do diretório de conteúdos do Hugo (content/). O strapi é servido pela porta 1337 da máquina virtual. + +## Hugo +É um framework de gerador de sites estáticos. O funcionamento dele é baseado pela existência de algum tema qualquer. Hugo possui um arquivo de configuração com a extensão .yml, onde possui algumas configurações gerais do site, bem como, é possível ter outras informação e apenas "referenciar" nos arquivos html/css. Ele é servido na porta 1313 da máquina virtual. + +## NGINX +O nginx é um software que utilizamos para hospedar ambos os sites (Strapi e C3SL). Com ele é possível balancear as cargas de acesso e usá-lo como proxy reverso, o que significa que o nginx ficará entre o servidor e o cliente. + +Possuímos um arquivo de configuração para cada site (Strapi e C3SL). Nesses arquivos direcionamos as rotas http para https; validamos o site por meio de um certificado digital, que faz uma ponte criptografada, além de informar como o NGINX vai administrar as solicitações de acesso às URL's. + +## Postgresql +É o banco de dados, o qual iremos utilizar juntamente com o Strapi. +Nele serão armazenada as informações, como: noticias, autores, projetos, etc. + +## DNS +O DNS serve para resolver os nomes de domínio para os endereços IP que o servidor NGINX usa, garantindo que o cliente consiga acessar o site. + + +## CNAME's +Um registro CNAME é um elemento de informação de um DNS (_Domain Name System_). +Os registros CNAME normalmente são usados para mapear um subdomínio como _www_ ou _mail_ ao domínio que hospeda o conteúdo desse subdomínio. + +Usamos o CNAME para mapear domínios. No projeto do site do C3SL, utilizaremos os seguintes: +**Strapi**: strapi.c3sl.ufpr.br +**Site do C3SL**: cms.c3sl.ufpr.br + +## Systemd + +O systemd é um gerenciador de tarefas de serviços controlado pelo kernel do sistema operacional. Ele faz com que softwares sejam executados em segundo plano, como serviços (chamados de Daemon). Podemos controlá-los por meio de comandos do `systemctl` +Por exemplo: + + systemctl status <nome_do_serviço> + systemctl start <nome_do_serviço> + systemctl stop <nome_do_serviço> +Para verificar os *log's* do strapi, podemos utilizar o comando `sudo journalctl -xefu strapi` + +## Imagem da arquitetura CMS + + diff --git a/source/pages/config_seo_drupal.md b/source/pages/config_seo_drupal.md new file mode 100644 index 0000000000000000000000000000000000000000..422e2c5c89c8c768242458c75be522e4d48bb288 --- /dev/null +++ b/source/pages/config_seo_drupal.md @@ -0,0 +1,46 @@ + +# Configuração de SEO no Drupal + +**Referências:** +- [https://www.drupal.org/node/1158446](https://www.drupal.org/node/1158446) +- [https://www.specbee.com/blogs/configuring-drupal-9-metatag-module](https://www.specbee.com/blogs/configuring-drupal-9-metatag-module) +- [https://www.webwash.net/getting-started-with-metatag-module-in-drupal/](https://www.webwash.net/getting-started-with-metatag-module-in-drupal/) + +## O que é SEO? + +- SEO (Search Engine Optimization) é um processo que ajuda a aumentar a **visibilidade do seu site no Google** e em outros motores de busca, com base nos **metadados configurados no site**. + +--- + +## Módulos de SEO no Drupal + +- Verificar os diversos **módulos de Metatag** disponíveis. +- O módulo **"Título da Página" (Title Page)** está **obsoleto**, portanto **não foi utilizado**. +- Em substituição, foi utilizado o módulo **Menu Link Attributes** (`menu_link_attributes`). + +- O módulo **Google Analytics** também está obsoleto, por isso **não foi baixado**. + +- Verifique a utilidade do módulo **Domain**: + - [https://www.drupal.org/project/domain](https://www.drupal.org/project/domain) + +- O **módulo de título para taxonomia** não possui planos de atualização para **Drupal 8 e 9**. + +--- + +## Redirecionamento e Configuração de URLs + +- A configuração ideal de redirecionamento deve ser feita com os módulos: + - **Pathauto** + - **Redirect** + +--- + +## Módulo Robots.txt + +- **Robots.txt** é um módulo útil para projetos **multisite Drupal**. +- Permite gerar um arquivo `robots.txt` **dinamicamente**, individual para cada site. +- A configuração é feita diretamente pela **interface administrativa (UI)** de cada site. + +--- + +Essas são boas práticas iniciais para garantir que o seu site Drupal esteja bem configurado para SEO e tenha boa performance nos mecanismos de busca. diff --git a/source/pages/documentacao.md b/source/pages/documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..9802d7a65e5f769a1453ad15dc7e87053dddf612 --- /dev/null +++ b/source/pages/documentacao.md @@ -0,0 +1,46 @@ +# Como navegar pelos documentos de Strapi e site Hugo na VM + +## Acesso na VM CMS: +Primeiramente, é necessário acessar o usuário *hugo* para visualização das pastas que contém o conteúdo geral do site. +comando: `su - hugo` + +### Pastas disponíveis para o acesso: + - **Pasta cms-c3sl:** + Nessa pasta, tem o diretório `/cms-c3sl/themes/c3sl`, dentro dele temos os diretórios principais para a configuração do site. + Na pasta `assets` contém os arquivos do frontend do site, sendo eles: css, javascript e scss. + Outra pasta importante é de `layout`, nela estão armazenadas os arquivos html de todo o site, onde é possível fazer as alterações de texto. + Em `exampleSite` está contido o arquivo principal de configuração do site, o `config.yml`, nele é possível fazer a definição geral do site. + Agora em `exampleSite/content/` estão os arquivos de markdown do site, como os arquivos de notícia, projetos e de quem somos. + E por fim, no diretório `exampleSite/content/` é reservado os arquivos gerados após ser feito o build do site, tudo o que aparece no site visualizado. + + - **Pasta strapi:** + A pasta armazena um arquivo importante que é o `.env` que possui variaveis de ambiente, como configurações de banco de dados, servidor, chaves de segurança e outras informações sensíveis, isso facilita o gerenciamento de diferentes ambientes (local e produção). + Nessa pasta é importante navegar até o diretório `config`, onde nela está armazenada o arquivo `server.js`, que no geral é responsável pela configuração do servidor, como se conectar com a rede e os principais aspectos de segurança. + Além disso, o programa `src/index.js` é usado para captar a dinâmica de postagens no strapi, ou seja, ele atua na manipulação de lifecycle hooks, que possui a função de dectar alterações nos arquivos do strapi, como a edição, despublicação, publicação e o delete. Esse programa faz a escrita em .md do que foi publicado na pasta `exampleSite/content/` comentada no tópico anterior sobre o site do c3sl + +## Execução operacional do site: + +### Systemd: +Para operar o site em produção é fundamental utilizar o serviço de systemd, sendo assim, para realizarmos uma configuração do systemd a fim que seja possível executar o nosso software como serviço (Deamon), será necessário acessar o caminho para o diretório `/etc/systemd/system/` e criar um arquivo com a extensão `.service`. +Podemos controlá-los por meio de comandos do `systemctl` Por exemplo: + + systemctl status <nome_do_serviço> + systemctl start <nome_do_serviço> + systemctl stop <nome_do_serviço> + +Para verificar os *log's* do strapi, podemos utilizar o comando sudo `journalctl -xefu strapi`. + +Dentro do arquivo podemos realizar algumas configurações, como: Em qual diretório serão executados os comandos; Quais tipos de comandos serão realizados (Inicialização do strapi, por exemplo = `pnpm run start`), entre outros. Veja abaixo + + WorkingDirectory=/home/hugo/strapi + ExecStart=/home/hugo/.nvm/versions/node/v21.6.1/bin/pnpm run start + +Note que, para executaro comando de inicialização do nosso serviço, é necessário informar o PATH do executável (Ex: pnpm). Podemos verificar o PATH pelo comando `which`. + +Para o gerenciamento do site hugo, é necessário a configuração de + + WorkingDirectory=/home/hugo/cms-c3sl/themes/c3sl/exampleSite + ExecStart=/usr/local/bin/hugo --watch --themesDir ../.. + +No qual, segue a mesma ideia do strapi, a flag `--watch` que detecta as alterações feitas nos principais diretorios do site e realiza a recompilação/build do site com as alterações atualizadas. + diff --git a/source/pages/drupal_documentacao.md b/source/pages/drupal_documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..40fec11136411d891bfb6c71cdffc03dc2bd2da8 --- /dev/null +++ b/source/pages/drupal_documentacao.md @@ -0,0 +1,208 @@ + +## Criação de Multi-Tenant - Ex: Site dos Professores + +1. Acesse o diretório: `.../web/sites/`. +2. Faça uma cópia do arquivo `example.sites.php` para `sites.php`. +3. No arquivo `sites.php`, insira no final: + ```php + $sites["<dominio>"] = "<diretorio_para_dominio>"; + ``` + **Exemplo:** + ```php + $sites["site1.com.br"] = "site1"; + ``` +4. Salve o arquivo. + +5. No diretório atual, crie os diretórios para os sites: + ``` + site1/files/translations + ``` + +6. Copie o arquivo `default.settings.php` do diretório `default/` para `site1`. + +7. Dê permissão com o comando: + ```bash + chmod -R 777 site1 + ``` + +8. Acesse o navegador com base no domínio informado para realizar a instalação do site. + +--- + +## Sobre o Drupal + +### Encapsulamento + +- O Drupal utiliza bastante encapsulamento de elementos: blocos, layouts, parágrafos. +- Criamos um parágrafo, definimos seu tipo (texto, imagem etc.). +- Associamos esse tipo de parágrafo ao conteúdo onde ele será exibido. +- A mesma lógica vale para blocos e layouts de blocos. + +### Funcionalidades dos Blocos + +- Estrutura padrão de blocos conforme o tema, disponível em todas as páginas. +- Blocos são fixos na tela (não reposicionáveis livremente). +- É possível definir a visibilidade do bloco por página. +- Criação de novos blocos: + - Blocos básicos. + - Blocos com DXPR Builder (drag and drop). +- DXPR Builder permite maior estilização (texto, imagens etc.). + +### Funcionalidades de Layouts/Views + +- Após criar ou editar blocos, podemos organizar os layouts por seção: + - Ex: cabeçalho, menu, conteúdo principal, sidebar, rodapé... +- Blocos básicos têm pouca estilização. +- Blocos com DXPR Builder oferecem mais recursos (texto, imagem). +- A estrutura padrão já vem configurada no site default. +- **Views** são formas de visualizar conteúdo (ajuste fino): + - Ex: ID da publicação, tags, tipo de conteúdo. +- Podemos criar views para exibir, por exemplo, notícias. + +### Construção de Página com o DXPR Builder + +- **Módulo DXPR Builder:** + [https://www.drupal.org/forum/support/theme-development/2024-03-12/drupal-10-bootstrap-5](https://www.drupal.org/forum/support/theme-development/2024-03-12/drupal-10-bootstrap-5) +- Estilo Drag and Drop sem código. +- Permite criação de: + - Carrosséis + - Textos + - Colunas + - Linhas +- 907 usuários relataram uso com 12 bugs em aberto. +- Recomendado para páginas como "Home", "Quem somos". +- Para notícias, usar módulos como Layout Paragraphs com estrutura fixa. + +### Dificuldades com Estilização de Temas + +- Drupal tem limitações na estilização de temas. +- Temas com maior liberdade geralmente são pagos. +- Temas usados: + - **Bootstrap** + - **DXPR** +- Alguns requerem linha de comando para configurar. + +### Tema Bootstrap 5 (via código com SASS) + +- Drupal nativo não permite alterar estilos facilmente. +- Bootstrap 5 oferece: + - Tema simples + - Criação de subtemas + - Estilização via SASS +- Arquivos importantes: + - `_variables_bootstrap5.scss` + - `_variable_drupal.scss` + - `style.css` + +### Tema Zero Point +[https://www.drupal.org/project/zeropoint](https://www.drupal.org/project/zeropoint) + +Permite estilização básica: +- Tamanho dos blocos +- Responsividade +- Menu principal +- Uso de sidebars +- Cores de hover +- SEO +- Links sociais +- Carrossel +- Alguns ajustes via linha de comando + +--- + +### Módulos Utilizados + +- DXPR Builder – Estrutura de conteúdo +- Layout Paragraphs – Drag and drop +- EBT – Semelhante ao Layout Paragraphs +- Bootstrap5 +- Zero Point (tema alternativo) + +--- + +## Criação de Conteúdo + +- Cada página no Drupal é baseada em um tipo de conteúdo: + - Artigo + - Página básica + - Drag and drop (com DXPR) +- Drag and drop oferece autonomia na criação (texto, colunas, carrossel etc.) + +### Barra de Pesquisa + +- Encontrado problema de busca em alguns momentos (bug pontual). + +### Instalação de Temas/Módulos via Composer + +- Não é permitido instalar via botão "Adicionar novo". +- Instalação obrigatoriamente via linha de comando com **Composer** (gerenciador PHP). + +### Busca por Temas No-Code + +- Objetivo: estilizar o site sem código. +- Temas gratuitos têm limitações de personalização. + +--- + +## Curva de Aprendizado do Drupal + +- CMS gratuito e open-source. +- Necessita compreensão do funcionamento em **camadas**: + - Nodes (dados publicados) + - Módulos + - Blocos e menus + - Permissões + - Templates + +- Exemplo: criar parágrafo -> configurar tipo de conteúdo -> vincular a bloco. +- Alguns temas apresentam status como "sem versão estável". +- Seção "Detalhe de Status" mostra alertas e falhas de segurança. + +--- + +## Problema com Domínio (Multi-Tenant) + +--- + +## Tecnologias Citadas + +- **CKEditor 5** +- **Twig** (debug de tema a partir do Drupal 9) +- **Drupal padrão** +- **Drupal headless** + +--- + +## Ideias para Artigo + +- **Pergunta-chave:** Existe alguma alternativa ao WordPress? +- **Introdução:** CMS, facilidade na criação de conteúdo. +- O que é um CMS +- CMS disponíveis +- CMS mais usados no Brasil e no mundo (Ásia, África, Europa, América do Norte) +- Diferenças entre Drupal e WordPress +- WordPress domina nas universidades brasileiras +- Drupal se destaca na Europa +- Problemas de segurança no WordPress (CVE’s, plugins como Elementor) +- Overhead no processo (ex: Zanata) +- Segurança no Drupal +- Experiência do usuário: prós e contras de cada CMS +- Busca por soluções no-code +- Nova proposta de CMS: + - **Hugo + Strapi** + - Hugo: site estático com tema + - Strapi: backend para enviar conteúdo via JSON + - Problemas de estilização com Hugo + - Possibilidade de criar tema próprio + +--- + +**Pergunta-chave:** Existe alguma alternativa ao WordPress? + +- WordPress sofre com falhas de segurança +- Hugo + Strapi tem limitações de estilização + +--- + +**Referência:** +[https://www.drupal.org/docs/getting-started/understanding-drupal/overview-of-drupal](https://www.drupal.org/docs/getting-started/understanding-drupal/overview-of-drupal) diff --git a/source/pages/example.md b/source/pages/example.md deleted file mode 100644 index 9414490ebda6161397b83787384df97885031b13..0000000000000000000000000000000000000000 --- a/source/pages/example.md +++ /dev/null @@ -1,34 +0,0 @@ -# Página de exemplo - -:::{todo} -Terminar esta página -::: - -:::{list-table} -* - **Tamanho desta página** - - Alguns kilobytes -* - **Data de criação** - - 2024-03-26 -::: - -Essa é uma página de exemplo. - -```console -$ ping -c 1 docs.c3sl.ufpr.br -PING docs.c3sl.ufpr.br(docs.c3sl.ufpr.br (2801:82:80ff:8002:216:ccff:feaa:72)) 56 bytes de dados -64 bytes de docs.c3sl.ufpr.br (2801:82:80ff:8002:216:ccff:feaa:72): icmp_seq=1 ttl=63 tempo=0.464 ms - ---- docs.c3sl.ufpr.br estatísticas de ping --- -1 pacotes transmitidos, 1 recebidos, 0% packet loss, time 0ms -rtt min/avg/max/mdev = 0.464/0.464/0.464/0.000 ms -``` - -|Podemos construir|Algumas tabelas | -|-----------------|-------------------------| -|Faz parte do que |o Markdown consegue fazer| - -## Configuração - -:::{note} -É possível fazer bem mais -::: diff --git a/source/pages/example2.md b/source/pages/example2.md deleted file mode 100644 index ecb797b35746d951bbc93f28dc43dcff191e5929..0000000000000000000000000000000000000000 --- a/source/pages/example2.md +++ /dev/null @@ -1,14 +0,0 @@ -# Página de exemplo 2 - -## Se quisermos linkar para outra página, é só referenciar - -* [Pode ser relativo.](example) -* [E pode ser absoluto.](/pages/example) - -## Que tal linkar para um conteúdo dentro de outra página? - -:::{warning} -Acho que talvez seja uma ideia interessante. -::: - -[Veja bem que precisa da extensão .md neste caso.](/pages/example.md#configuracao) diff --git a/source/pages/hugo_documentacao_completa.md b/source/pages/hugo_documentacao_completa.md new file mode 100644 index 0000000000000000000000000000000000000000..4ccdd5c8f9283b8e4dae3d814a7c7e399f6246f2 --- /dev/null +++ b/source/pages/hugo_documentacao_completa.md @@ -0,0 +1,128 @@ + +# Hugo - Gerador de Sites Estáticos + +## O que é? + +- **Hugo** é um gerador de sites estáticos e uma aplicação **Open Source** que auxilia o criador a gerenciar, publicar e divulgar seu conteúdo. +- Usado para criar: + - Sites corporativos + - Governamentais + - Sem fins lucrativos + - Educação + - Notícias + - Eventos e projetos + - Blogs empresariais + - Portfólios de imagem + +## O que é um Site Estático? + +- Site que **não possui ferramentas de gerenciamento de conteúdo dinâmico**. +- Modificações devem ser feitas diretamente no código. +- Ideal para desempenho, velocidade e segurança. + +## Características + +- Otimizado para velocidade (reputação de ser um dos mais rápidos - **~1ms**). +- Estrutura flexível, suporte multilíngue e sistema robusto de taxonomia. +- Backend gerenciado por **editores de texto**. + +## O que é Markdown? + +- **Markdown** é uma linguagem de marcação para formatação de texto. +- Exemplo: `*itálico*` ou `_itálico_`. +- Hugo suporta **Markdown** e **HTML**. + +## Suporte a Backend + +- É possível usar **API** com **Python/PHP** no backend. + +## Linguagem + +- Hugo é desenvolvido em **Go**. +- Suporta conteúdo em: + - Markdown (MD) + - HTML + - JavaScript + - CSS + - JSON + - AMP + - YAML + +## Escalabilidade + +- Alta escalabilidade com baixo consumo de recursos. +- Suporta múltiplos acessos simultâneos com infraestrutura mínima. + +## Atualizações + +- Sim, recebe atualizações constantes. +- Última versão: **v0.125.5 (02/05/2024)** + +## Facilidade de Uso + +- Pode ser operado por **linha de comando**. +- Para iniciantes, há **interfaces gráficas amigáveis**: + - Enwrite + - Lipi + - Netlify CMS + - Hokus CMS + +## Vantagens + +- Carregamento rápido com arquivos pré-renderizados (HTML, CSS, JS). +- Segurança: não utiliza banco de dados. +- Compilação instantânea e publicação rápida. +- Migração rápida de WordPress. +- Suporte a conteúdo ilimitado sem plugins. +- Liberdade de estrutura e modelo para desenvolvedores. +- Baixo custo com infraestrutura (pode rodar em servidor de 1GB RAM). +- Facilidade de hospedagem (qualquer servidor aceita HTML estático). +- Sites mantidos com poucos recursos e fácil manutenção. +- Conteúdo facilmente gerenciado via terminal com arquivos Markdown. + +## Desvantagens + +- Requer conhecimento técnico em programação. +- Ausência de CMS nativo e interface amigável. +- Difícil encontrar templates e documentações completas. +- Algumas funcionalidades precisam ser manuais. +- Necessário uso de ferramentas de terceiros para: + - Formulários de contato + - Comentários + - Busca interna + +## Comparação com WordPress (Opiniões de Usuários) + +- WordPress é um CMS dinâmico, baseado em **PHP + MySQL**. +- Hugo evita complexidades de banco de dados e consumo elevado de RAM. +- WordPress exige muitos ajustes para alcançar boa performance. +- Hugo oferece: + - **Maior desempenho** + - **Menor custo de manutenção** + - **Menos dores de cabeça com backup, cache, lentidão etc.** + +> "Construí um site com muitos dados com o Hugo e é horrível. O mecanismo de modelo é muito ruim. Difícil escrever pequenas funções reutilizáveis..." +> [Discussão completa](https://news.ycombinator.com/item?id=24670439) + +> "Antes de colocar um MySQL gigantesco na sua aplicação, pense: você realmente precisa de um banco de dados? Com Hugo, você pode ter um site robusto sem isso." + +> "Mesmo com otimizações no WordPress, ele ainda é mais lento comparado a sites estáticos com Hugo." + +## Comando Curioso + +- Comando `hugo -V`: + Gera uma pasta `public` com os arquivos HTML, prontos para serem enviados ao servidor remoto (ex: Apache). + +## Referências + +- [https://serverdo.in/hugo-sites-estaticos/](https://serverdo.in/hugo-sites-estaticos/) +- [https://gohugo.io/](https://gohugo.io/) +- [https://dev.to/feministech/pt-br-hugo-a-forma-mais-rapida-de-fazer-um-site-5hk7](https://dev.to/feministech/pt-br-hugo-a-forma-mais-rapida-de-fazer-um-site-5hk7) +- [https://brito.com.br/posts/hugo-gerador-sites/](https://brito.com.br/posts/hugo-gerador-sites/) +- [https://kinsta.com/pt/blog/site-estatico-hugo/](https://kinsta.com/pt/blog/site-estatico-hugo/) +- [https://www.youtube.com/watch?v=G6GAUO2PNXU](https://www.youtube.com/watch?v=G6GAUO2PNXU) +- [https://www.youtube.com/watch?v=927wgzzNMEA](https://www.youtube.com/watch?v=927wgzzNMEA) +- [https://www.strattic.com/jekyll-hugo-wordpress-pros-cons-static-site-generators](https://www.strattic.com/jekyll-hugo-wordpress-pros-cons-static-site-generators) +- [https://www.sanity.io/glossary/hugo](https://www.sanity.io/glossary/hugo) +- [https://strapi.io/blog/guide-to-using-hugo-site-generator](https://strapi.io/blog/guide-to-using-hugo-site-generator) +- [https://tableless.com.br/primeiros-passos-com-hugo/](https://tableless.com.br/primeiros-passos-com-hugo/) diff --git a/source/pages/introducao_drupal.md b/source/pages/introducao_drupal.md new file mode 100644 index 0000000000000000000000000000000000000000..7742ade8d00e56fdc1001a3c91df45dc0588138d --- /dev/null +++ b/source/pages/introducao_drupal.md @@ -0,0 +1,67 @@ + +# Introdução ao Drupal + +## O que é? + +- O Drupal é um dos Content Management Systems (CMS) mais usados no mundo por instituições de diversos tipos. +- Companhias nacionais e internacionais adotam-no por ser uma solução robusta, escalável e que dá liberdade ao desenvolvedor de criar soluções inovadoras na web. +- Oferece flexibilidade para: + - Criação e organização de conteúdo. + - Manipulação da aparência do site. + - Automatização de tarefas administrativas. + - Definição de permissões para usuários e colaboradores. +- Pode ser utilizado na criação de: + - Sites de comércio eletrônico. + - Revistas. + - Jornais. + - Portfólios. + - Entre outros. + +## Em que linguagem é escrito? + +- Escrito em **PHP** e **JavaScript**. + +## Quão escalável é? + +- Alta escalabilidade. + +## Recebe atualizações? + +- Sim, recebe atualizações. +- No entanto, o processo de atualização é mais complicado. +- Instalações legadas não são compatíveis com novas versões do Drupal. +- Não há compatibilidade com versões anteriores, exigindo sempre atualização completa, o que consome tempo. + +## Quão difícil é usar? + +- Requer conhecimento técnico. +- Para instalação do Drupal, é necessário: + - Um servidor web. + - Um banco de dados (MySQL). + - Um cliente FTP (File Transfer Protocol). + - Servidor PHP instalado. + +## Vantagens + +- Projeto **open source**. +- Gratuito. +- Ambiente de desenvolvimento pré-configurado. +- Plataforma acessível. +- Facilidade no uso. +- Requer poucos recursos de servidor. +- Segurança. + +## Desvantagens + +- Inicialmente, pode ser difícil de aprender. +- Processo de configuração pode ser demorado, especialmente com muitos módulos. +- Limitação na quantidade de módulos. +- Pequenas falhas podem afetar o desempenho (lentidão). +- Uso intensivo de plugins. + +## Referências + +- [https://drupal.org.br/](https://drupal.org.br/) +- [https://www.treinaweb.com.br/blog/o-que-e-drupal](https://www.treinaweb.com.br/blog/o-que-e-drupal) +- [https://www.guru99.com/pt/joomla-vs-wordpress-vs-drupal.html#9](https://www.guru99.com/pt/joomla-vs-wordpress-vs-drupal.html#9) +- [https://webnus.net/pt/wordpress-vs-drupal/](https://webnus.net/pt/wordpress-vs-drupal/) diff --git a/source/pages/introducao_hugo.md b/source/pages/introducao_hugo.md new file mode 100644 index 0000000000000000000000000000000000000000..a7b578513a1dcb46b6193d11da25cccdf8647c79 --- /dev/null +++ b/source/pages/introducao_hugo.md @@ -0,0 +1,74 @@ + +# Introdução ao Hugo + +## O que é? + +- **Hugo** é um gerador de site estático open-source. +- É considerado um tipo de **CMS (Content Management System)**, pois auxilia na criação, gerenciamento e publicação de conteúdo. +- Seu principal objetivo é o **baixíssimo consumo de recursos**. +- Otimizado para velocidade, é conhecido como: + > “The world’s fastest framework for building websites” +- Oferece: + - Estrutura flexível + - Suporte multilíngue + - Forte sistema de taxonomia + +- É utilizado para: + - Sites corporativos + - Sites governamentais + - Sites educacionais + - Organizações sem fins lucrativos + - Projetos de notícias e eventos + - Blogs empresariais + - Portfólios de imagem + +## Em que linguagem é escrito? + +- Hugo é desenvolvido em **Go (Golang)**. + +## Quão escalável é? + +- Hugo apresenta **alta escalabilidade**, sendo uma das principais vantagens da plataforma. + +## Recebe atualizações? + +- Sim, Hugo recebe atualizações constantes através da comunidade e seu repositório no GitHub. + +## Quão difícil é usar? + +- Com baixo consumo de recursos, o uso do Hugo é feito principalmente via **linha de comando**. +- Evita o uso de interfaces pesadas. +- Para usuários sem conhecimento técnico avançado, existem **interfaces gráficas amigáveis** que facilitam o gerenciamento, como: + - Enwrite + - Lipi + - Netlify CMS + - Hokus CMS + +## Vantagens + +- Ideal para atualizações frequentes, com publicação rápida de novos conteúdos. +- **Migração do WordPress rápida e eficiente.** +- Suporte a: + - Conteúdos ilimitados + - Taxonomias + - Sem necessidade de plugins (diferente do WordPress) +- Desenvolvedores têm liberdade total para criar modelos personalizados, sem limitações de campos ou estruturas pré-definidas por CMS tradicionais. + +## Desvantagens + +- Dificuldade em encontrar: + - Documentações claras + - Templates prontos + - Recursos avançados +- Falta de interface amigável pode ser um obstáculo para usuários menos técnicos. +- Utilização de dados não formatados pode ser **intimidante**. +- Suporte técnico é frequentemente necessário para manutenção e atualizações. + +## Referências + +- [https://github.com/gohugoio/hugo](https://github.com/gohugoio/hugo) +- [https://serverdo.in/hugo-sites-estaticos/](https://serverdo.in/hugo-sites-estaticos/) +- [https://tableless.com.br/primeiros-passos-com-hugo/](https://tableless.com.br/primeiros-passos-com-hugo/) +- [https://products.containerize.com/pt/blogging/hugo/](https://products.containerize.com/pt/blogging/hugo/) +- [https://igluonline.com/por-que-troquei-o-wordpress-pelo-gerador-de-websites-estaticos-hugo/](https://igluonline.com/por-que-troquei-o-wordpress-pelo-gerador-de-websites-estaticos-hugo/) +- [https://www.cloudflare.com/pt-br/learning/performance/static-site-generator/](https://www.cloudflare.com/pt-br/learning/performance/static-site-generator/) diff --git a/source/pages/jekyll_documentacao.md b/source/pages/jekyll_documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..70a0bac05a1b709a25e9f95175c87dcd9c3e1257 --- /dev/null +++ b/source/pages/jekyll_documentacao.md @@ -0,0 +1,59 @@ + +# Jekyll - Concorrente do Hugo + +## O que é? + +- **Jekyll** é um gerador de site estático open-source. + +## Em que linguagem é escrito? + +- Escrito em **Ruby** (pré-requisito para instalação e execução). +- Permite que o usuário gere conteúdos em **HTML**, **CSS** e **JavaScript**. + +## Escalabilidade + +- Jekyll é escalável, mas **em sites maiores pode apresentar lentidão na construção** (build time). +- Para sites com **mais de 150 páginas**, além de configurações e plugins, o tempo de build pode ser bastante lento. + +## Facilidade de Uso + +- Facilidade na criação de arquivos em **Markdown**, sem necessidade de conhecimentos avançados em HTML/CSS. +- Ideal para **projetos simples** e com baixo volume de páginas. + +## Atualizações + +- Sim, o Jekyll recebe atualizações frequentes e possui uma **comunidade ativa** de desenvolvedores. + +## Vantagens + +- Suporte nativo a **Markdown**, facilitando a criação de conteúdo. +- **Dispensa o uso de banco de dados**, aumentando a segurança do site. +- **Arquivos HTML pré-renderizados**, melhorando a performance. +- **Integração com GitHub Pages**: + - Hospedagem gratuita diretamente do GitHub. + - Facilita implementação e colaboração em projetos. +- Comunidade ativa e boa base de temas/plugins. + +## Desvantagens + +- **Menor variedade e qualidade de componentes/temas** comparado a plataformas como WordPress. +- **Builds lentos para sites grandes**, impactando performance de desenvolvimento. +- **Necessidade de executar Ruby localmente** para personalizações com plugins. +- Customizações são todas feitas com **Ruby**, o que pode ser um obstáculo para desenvolvedores não familiarizados com a linguagem. + +## Comparação: Hugo vs Jekyll + +| Aspecto | Hugo | Jekyll | +|--------------------------|-------------------------------------------|------------------------------------------| +| Linguagem | Go | Ruby | +| Velocidade de Build | Extremamente rápido | Lento em sites grandes | +| Facilidade para Iniciantes | Linha de comando, mas há interfaces amigáveis | Mais fácil com GitHub Pages | +| Integração com GitHub | Suporta, mas não nativamente | Totalmente integrado com GitHub Pages | +| Comunidade | Ativa | Ativa | +| Ecossistema | Temas e plugins variados | Melhor integração com GitHub | +| Escalabilidade | Alta | Limitada em projetos grandes | + +## Extensões para o Jekyll + +- O Jekyll pode ser estendido com diversos plugins, mas todos devem ser desenvolvidos em **Ruby**. + diff --git a/source/pages/joomla_documentacao.md b/source/pages/joomla_documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..7dd4078681606894a42957d04a903d6187b487fb --- /dev/null +++ b/source/pages/joomla_documentacao.md @@ -0,0 +1,59 @@ + +# Joomla - CMS Open Source + +## O que é? + +- **Joomla** é um **CMS (Content Management System)** open source. +- Utiliza **templates com funcionalidades pré-definidas**, como: + - Formulários de contato + - Caixas de comentários + - Galeria de fotos + - Entre outras + +## Linguagem + +- Desenvolvido em **PHP** e utiliza **MySQL** como banco de dados. + +## Participação de Mercado + +- Aproximadamente **5% do mercado** utiliza o Joomla. + +## Versões Disponíveis + +- **Joomla CMS** +- **Joomla Framework** + +## Atualizações + +- O Joomla realiza **verificações automáticas de atualizações**. +- Notifica os administradores e permite **atualizações com poucos cliques**, incluindo extensões instaladas. + +## Vantagens + +- Suporte a **múltiplas linguagens** nativamente, ideal para sites multilíngues. + +## Desvantagens + +- Menor variedade de **plugins/extensões** comparado ao WordPress. +- **Curva de aprendizado mais longa** que outros CMS populares, como WordPress. + +## Extensões Populares para Joomla + +- **JCE (Joomla Content Editor):** + Facilita a escrita de artigos e a inserção de imagens, vídeos e links. + +- **JSN PowerAdmin:** + Interface drag and drop para personalização de menus e posicionamento de artigos. + +- **Antivirus Website Protection:** + Extensão para reforçar a **segurança do site**. + +## Comparação: Joomla vs WordPress + +| Critério | Joomla | WordPress | +|-----------------------|----------------------------------------------|---------------------------------------------| +| Escalabilidade | Requer conhecimento técnico para customização | Grande variedade de plugins e temas | +| Performance | Mais rápido e estável | Pode exigir mais otimização e recursos | +| Facilidade de uso | Curva de aprendizado maior | Interface mais intuitiva para iniciantes | +| Comunidade e suporte | Menor ecossistema de extensões | Ecossistema robusto e ampla comunidade | + diff --git a/source/pages/migracao_wordpress_para_drupal.md b/source/pages/migracao_wordpress_para_drupal.md new file mode 100644 index 0000000000000000000000000000000000000000..6f132cc946225b49d79df4dd8231dcbddbb3b1ae --- /dev/null +++ b/source/pages/migracao_wordpress_para_drupal.md @@ -0,0 +1,56 @@ + +# Migração do WordPress para Drupal + +**Referência:** +- [https://www.o8.agency/blog/drupal/wordpress-drupal-migration-how-and-why](https://www.o8.agency/blog/drupal/wordpress-drupal-migration-how-and-why) +- [https://www.droptica.com/blog/how-migrate-wordpress-drupal-step-step-guide/](https://www.droptica.com/blog/how-migrate-wordpress-drupal-step-step-guide/) + +## Etapas da Migração + +1. **Exporte seu conteúdo do WordPress** +2. **Configure um novo site Drupal** +3. **Instale o módulo WordPress Migrate no Drupal** +4. **Importe seu conteúdo para o Drupal** + +--- + +## Exportação de Conteúdo no WordPress + +- Salve/exporte o conteúdo em formato **XML**, pois o módulo **WordPress Migrate** aceita esse formato. +- Acesse o painel do WordPress como administrador: + - Vá em **Ferramentas > Exportar** + - Selecione o que deseja exportar (geralmente, todo o conteúdo) + - Clique em **“Baixar arquivo de exportação”** + +> **Dica:** Recomendado validar o arquivo XML em sites como [W3Schools](https://www.w3schools.com/xml/xml_validator.asp) + +--- + +## Módulos Requeridos no Drupal + +O módulo **WordPress Migrate** possui dependências: + +- WordPress Migrate +- Migrate Plus +- Migrate Tools +- CTools + +--- + +## Processo de Migração no Drupal + +- Após instalação dos módulos, acesse: + **Admin > Estrutura > Migração** + +- O Drupal solicitará a criação de novas contas de usuário com base nas configurações do WordPress ou a importação para uma única conta Drupal. + - Escolha a opção que preferir. + +- Você poderá importar: + - **Tags e categorias** do WordPress como **tags no Drupal** + - **Tipos de conteúdo**: + - Postagens de blog → Artigos + - Páginas → Páginas básicas + +--- + +Com essas etapas concluídas, seu conteúdo estará migrado e ajustado para o ambiente Drupal. diff --git a/source/pages/modulo_dxpr_builder.md b/source/pages/modulo_dxpr_builder.md new file mode 100644 index 0000000000000000000000000000000000000000..dfd5285ed0ec2ca2e9524ea2614551d27974f755 --- /dev/null +++ b/source/pages/modulo_dxpr_builder.md @@ -0,0 +1,47 @@ + +# Módulo DXPR Builder - Drag and Drop + +## Arquitetura + +- Compatível com **Drupal 7+** +- Utiliza **JQuery UI** (drag and drop) +- **Bootstrap 3** (layout e design) +- **CKEditor 4** (editor de linha) + +## Linguagens Utilizadas + +- PHP +- JavaScript +- YML + +## Estatísticas de Uso + +- **942 sites** reportaram uso do módulo no Drupal (até 19/02/2025). +- Segundo o site oficial do DXPR: + - Módulo está presente em **vários projetos da ONU**. + - Utilizado por **mais de 2000 organizações**. + +## Relatórios de Problemas + +- Total de issues (problemas + correções): **50** +- Relatórios de bugs: **27** +- Bugs em aberto até o momento: **14** + +### Exemplos de Problemas Relatados + +- Problemas com **carrosséis** (lentidão e travamento). +- Problemas ao **salvar conteúdo de texto**. +- Carrossel **não responde aos visitantes** do site. + +## Licença e Limitações + +- **DXPR é gratuito**, mas possui **planos pagos**. +- O plano gratuito permite até **100 itens/blocos por site**. + - **Exemplo:** Uma página criada com DXPR é considerada um “item”. + - O **rodapé com informações de endereço**, se feito com DXPR, também conta como item. + +- **É necessário obter uma DXPR license** para utilização do módulo. + - OBS: Autenticação foi criada com um e-mail compartilhado com todos os sites dos professores. + +- **Link da licença DXPR:** + [https://dxpr.com/legal/terms](https://dxpr.com/legal/terms) diff --git a/source/pages/modulo_hacked_drupal.md b/source/pages/modulo_hacked_drupal.md new file mode 100644 index 0000000000000000000000000000000000000000..1ed95b8aed7f0723cf5bf22d58b1ed90e0e5d6e1 --- /dev/null +++ b/source/pages/modulo_hacked_drupal.md @@ -0,0 +1,19 @@ + +# Módulo Hacked no Drupal + +## O que é? + +- O **módulo Hacked** não impede que o site seja hackeado, mas realiza uma varredura no sistema Drupal. +- Ele verifica os **módulos e temas** instalados, baixando novamente suas versões originais e comparando os arquivos para identificar **alterações realizadas**. + +## Funcionalidade + +- O módulo escaneia: + - Módulos contrib + - Temas +- Verifica se houve **modificação nos arquivos originais**. + +## Dependência + +- **Módulo Diff**: necessário para visualizar as diferenças entre arquivos, permitindo verificar **linhas alteradas** diretamente. + diff --git a/source/pages/modulos_drupal.md b/source/pages/modulos_drupal.md new file mode 100644 index 0000000000000000000000000000000000000000..20ef8df071623d1bac68dc87a79c8947af95e08c --- /dev/null +++ b/source/pages/modulos_drupal.md @@ -0,0 +1,48 @@ + +# Lista de Módulos Utilizados no Drupal + +## Acessibilidade + +- Accessibility Menu +- Advanced Language Selector +- Auto Translation +- Configuration Translation +- Content Translation +- Interface Translation +- Fluid UI Infusion + +## SEO (Search Engine Optimization) + +- Pathauto +- Chaos Tools +- Chaos Tools Blocks +- Chaos Tools Views +- Site Verification +- XMLSitemap (todos os pacotes) +- Redirection +- Redirection 4040 +- Redirection Domain +- Panels +- Panels IPE +- Menu Link Attributes + +## Migração WordPress → Drupal + +- Migrate +- Migrate Plus +- Migrate Tools +- WordPress Migrate Support +- WordPress Migrate UI +- Metatags (todos os pacotes) +- Taxonomy + +## Geral + +- Layout Paragraphs +- DXPR Builder +- DXPR Builder Block Type +- DXPR Theme Helper +- Bootstrap Layout Builder +- Bootstrap Styles +- Bootstrap Tools +- Site Verification diff --git a/source/pages/plone_documentacao.md b/source/pages/plone_documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..115a390941b4027701920a926538fe9b9d5747cb --- /dev/null +++ b/source/pages/plone_documentacao.md @@ -0,0 +1,39 @@ + +# Plone - CMS Open Source em Python + +## O que é? + +- **Plone** é um CMS (**Content Management System**) de **código aberto** baseado em **Python**, projetado para atender às necessidades de: + - Empresas + - Instituições governamentais + - Organizações que priorizam **segurança**, **estabilidade** e **escalabilidade** + +- Lançado em **2001**, o Plone é construído sobre o **Zope**, um servidor de aplicativos web também open source e escrito em Python. + +- **Zope** fornece uma estrutura robusta para o desenvolvimento de aplicativos web dinâmicos e escaláveis. + +## Vantagens + +- **Segurança**: + - Reconhecido como um dos CMS mais seguros disponíveis. + - Arquitetura robusta e comunidade ativa para correção de vulnerabilidades. + +- **Flexibilidade**: + - Sistema altamente adaptável às necessidades específicas dos usuários. + +- **Capacidade de personalização**: + - Possui recursos que permitem adaptar o site conforme requisitos do projeto. + +- **Editor visual intuitivo**: + - Facilita a **criação e edição de conteúdo** mesmo por usuários não técnicos. + +- **Recursos de clustering**: + - Suporte para divisão do site em **vários servidores**, ideal para ambientes com **alto volume de tráfego**. + +## Desvantagens + +- (Conteúdo não informado) + +## Referências + +- [https://medium.com/@lerobitcast/descubra-o-poder-do-plone-4575858e2555](https://medium.com/@lerobitcast/descubra-o-poder-do-plone-4575858e2555) diff --git a/source/pages/wordpress_documentacao.md b/source/pages/wordpress_documentacao.md new file mode 100644 index 0000000000000000000000000000000000000000..d86cfe4223888ac2424818dc9afd44288bbbdeda --- /dev/null +++ b/source/pages/wordpress_documentacao.md @@ -0,0 +1,90 @@ + +# WordPress - Sistema de Gerenciamento de Conteúdo (CMS) + +## O que é? + +- **WordPress** é um sistema de gerenciamento de conteúdo (**CMS**) que auxilia na criação, edição e organização de conteúdos de páginas. +- Funciona com base em **temas** e **diversos plugins** desenvolvidos pela comunidade. +- Muito conhecido pela **praticidade** e facilidade de uso. +- Permite a criação de: + - Textos + - Formulários + - Vídeos e imagens + - Personalização de layout +- Requer **hospedagem** e **domínio**. + +## Linguagem + +- Baseado em **PHP** +- Utiliza **MySQL** como banco de dados + +## Escalabilidade + +- Ambiente **altamente escalonável** +- Capaz de lidar com tráfego praticamente ilimitado, dependendo do **plano de hospedagem** +- **Formas de escalar um site:** + - **Vertical (scale up):** aumento da capacidade de hardware (CPU, memória) + - **Horizontal (scale out):** distribuição da carga entre múltiplos servidores + +> “Com o WordPress, você não precisa se preocupar com o software. O núcleo WordPress implementa convenções de arquitetura de software, como a separação de markup (HTML e CSS) e dados (MySQL).” +> [Fonte](https://maquinaderesultados.com.br/o-seu-site-wordpress-e-escalavel/) + +## Facilidade de Uso + +- Ferramenta **intuitiva e fácil de usar**, mesmo para iniciantes. + +## Atualizações + +- **Atualizações constantes** +- Última versão: **6.5.2 (abril/2024)** +- Próxima versão: **6.6 (lançamento previsto: 16/07/2024)** +- **Comunidade ativa** responsável pelas manutenções e melhorias contínuas + +## Vantagens + +- Interface intuitiva +- Alta segurança (atualizações frequentes) +- Grande variedade de plugins disponíveis +- Código aberto (**Open Source**) +- Controle do frontend e backend + +## Desvantagens + +- **Tempo de carregamento pode ser elevado** devido a: + - Muitos plugins + - Imagens grandes + - Código não otimizado +- **Erros comuns:** + - Arquivos corrompidos + - Erros de conexão com banco de dados + - Erros de gateway (quando a página demora para carregar) +- **Ameaças de segurança constantes** +- Necessário manter plugins **sempre atualizados** +- **Recomenda-se o uso de plugins de segurança** + +## Observações + +- O **site do C3 utiliza WordPress.org** + +## Informações de Domínio (UFPR) + +``` +domain: ufpr.br +owner: UFPR (Universidade Federal do Paraná) +owner-c: DRDUF +tech-c: DRDUF +nserver: ns.ufpr.br 200.17.209.1 2801:82:8020:0:8377:0:209:1 +nserver: ns2.ufpr.br 200.17.209.123 2801:82:8020:0:8377:0:209:2 +created: before 19950101 +changed: 20151110 +status: published +``` + +## Referências + +- [https://www.hostinger.com.br/tutoriais/o-que-e-wordpress](https://www.hostinger.com.br/tutoriais/o-que-e-wordpress) +- [https://www.oracle.com/br/content-management/what-is-cms/](https://www.oracle.com/br/content-management/what-is-cms/) +- [https://rockcontent.com/br/talent-blog/wordpress-entenda-as-vantagens-e-desvantagens-da-ferramenta/](https://rockcontent.com/br/talent-blog/wordpress-entenda-as-vantagens-e-desvantagens-da-ferramenta/) +- [https://www.intermidias.com.br/marketing-digital-online/wordpress-e-bom/](https://www.intermidias.com.br/marketing-digital-online/wordpress-e-bom/) +- [https://www.linkoficial.com.br/quanto-trafego-o-wordpress-pode-lidar/](https://www.linkoficial.com.br/quanto-trafego-o-wordpress-pode-lidar/) +- [https://maquinaderesultados.com.br/o-seu-site-wordpress-e-escalavel/](https://maquinaderesultados.com.br/o-seu-site-wordpress-e-escalavel/)