TriumphmayflowerClub.com 

El Triumph Mayflower Club es una organización dedicada a la preservación del clásico automóvil de los años 50, el Mayflower, por el fabricante de automóviles británicos Triumph. El club en sí se formó en 1974 e hizo su incursión inicial y limitada en la World Wide Web en 2005, y luego yo (Andi, Project Mostener) fue comisionado en 2017 para crear un nuevo sitio web desde cero cuando mis padres se convirtieron en miembros. Haga clic aquí si está interesado en leer más sobre el automóvil y el club.
Este nuevo sitio web está escrito en Vanilla HTML5 para el marcado de los documentos, CSS3 para el estilo, una pequeña cantidad de JavaScript (ES6) y está construido con Jekyll como un generador de sitios estático para minimizar la duplicación de código. Está diseñado para ejecutarse en cualquier navegador importante "Evergreen" (es decir, Microsoft Edge basado en Chromium, Google Chrome, Mozilla Firefox, Apple Safari u Opera), escritorio o móvil, sin problemas.
La situación de alojamiento actual para el sitio de producción solo es realmente adecuada para alojar un sitio HTML estático (yay, restricciones presupuestarias de un club de nicho), por lo que no es realmente práctico alojar nada más que eso, por ejemplo, una aplicación de servidor ASP.NET Core para una funcionalidad más avanzada, por lo que lo considero un poco de desafío de ingeniería personal para ver cuándo puedo impulsar los límites de lo que se puede hacer, características más avanzadas. para una solución de servidor cliente más compleja.
Las diferentes versiones alojadas del sitio web se pueden encontrar en las siguientes ubicaciones, donde el servidor Canary es el sitio de GitHub Pages generado automáticamente en el último master , el área de puesta en escena es un subdominio del sitio web en vivo que implementamos manualmente cuando queremos probar nuevas características y el sitio de producción es el sitio web actual de avisión pública (también desplegada para manual):
¡Ah, y solo por diversión, así es como se veía el antiguo sitio web para comparar!
El sistema de lanzamientos de GitHub se utiliza para incrementar la versión, etiquetar y publicar lanzamientos, y es la única fuente de verdad para la versión actual del sitio web. Ningún número de versión se mantiene explícitamente en los archivos del repositorio.
Dado que esta base de código es un sitio web, obviamente no hay necesidad de mantener ninguna rama de lanzamiento para las correcciones de backport, ya que solo habrá un sitio en vivo que siempre tendrá los últimos cambios en él.
Cuando se lanza una nueva versión del sitio a través de GitHub, el sitio web consultará un punto final de la API de GitHub específico en tiempo de ejecución para obtener tanto el número de versión de la última versión como la fecha de publicación, que luego se muestra al usuario final en el pie de página de cada página.
Semver se utiliza, aunque libremente, como un esquema de numeración de versión para el sitio web. Las piezas mayores , menores y de parche se superan para una liberación de acuerdo con los siguientes tipos de cambio a la base de código:
Hasta ahora, se han publicado dos lanzamientos principales, que se enumeran a continuación con sus cambios clave, así como qué características están actualmente en progreso para la próxima actualización importante: cada lanzamiento histórico jamás publicado desde que viene con este nuevo sitio se puede encontrar en la página de lanzamientos:
Esta es una lista no exhaustiva de las cosas que me gustaría agregar en el desarrollo futuro, sin ningún orden particular. Obviamente, esto está sujeto a cambios, pero debería ser una buena indicación de lo que viene. Haré marcar las cosas como y cuando terminen. Finalmente, quiero llegar a una etapa en la que haya proporcionado suficientes herramientas para que la mayoría del contenido pueda ser publicado por otras personas, para que me liberen para trabajar principalmente en agregar nuevas características.
He tratado de escribir este readme de tal manera que aquellos que no están necesariamente familiarizados con la codificación tienen una oportunidad de contribuir al desarrollo del sitio web si están tan inclinados; como miembros del club. Como tal, si ya eres un desarrollador, algunas de estas instrucciones pueden parecer un poco demasiado verbosas, por lo que probablemente puedas omitir algunos elementos. Por el contrario, si no es demasiado experto en tecnología, le recomiendo leer todo si desea poder ayudarnos con el sitio; por cierto, es absolutamente bienvenido aquí cualquier nivel de experiencia (si lo hubiera), de ahí que haya tratado de ser lo más explícito posible con las instrucciones, así que no se sienta desanimado si parece abrumador! Envíeme un correo electrónico si desea involucrarse, pero podría comenzar una mano, y estaría feliz de ponerlo en marcha.
En su mayor parte, estos son los requisitos de mínimo desnudo para obtener y pasar.
Si bien no es estrictamente un requisito, me desarrollaré personalmente en Windows, por lo que, naturalmente, esta guía se adapta a la configuración de un entorno de desarrollo establecido en una PC de Windows. Si está en Windows, le recomiendo actualizar a Windows 10 si aún no lo ha hecho:
No tengo ningún problema con los contribuyentes que se desarrollan usando macOS o Linux, suponiendo que sepa lo que está haciendo y se apegará a las terminaciones de línea de estilo Windows ( CR+LF ). Puedo ampliar estas instrucciones en el futuro si hay suficiente demanda de personas que desean desarrollarse en otras plataformas: ¡no dude en enviar una solicitud de extracción para actualizar el ReadMe con dichas instrucciones si es uno de esos desarrolladores!
Git es lo que se conoce como un sistema de control de versiones (VCS) y es lo que millones de desarrolladores en todo el mundo usan todos los días para administrar sus bases de código. Proporciona un historial completo de cambios realizados en el repositorio de código fuente, así como herramientas para ayudar a múltiples desarrolladores a trabajar juntos en la misma base de código de forma remota desde potencialmente en cualquier parte del planeta. El nuevo sitio web de Triumph Mayflower se está desarrollando actualmente utilizando GIT como VCS para proporcionar una columna vertebral sólida para nuestro proceso de desarrollo. Siga estos pasos para instalar GIT para Windows:
El código fuente del sitio web está alojado en GitHub (en el sitio web en el que actualmente está leyendo esto). Para descargar y modificar el código fuente, deberá registrarse para obtener una cuenta de GitHub:
ssh-keygencat ~/.ssh/id_rsa.pub > /dev/clipboardPara aquellos que no están familiarizados, un "repositorio" Git o "repose" para abreviar, es un conjunto de archivos de código fuente (generalmente almacenados en un servidor centralizado "remoto" en algún lugar) junto con los archivos de metadatos administrados por GIT específicos que contienen información sobre dónde se puede encontrar el servidor remoto en Internet (o red local), se hicieron varias piezas de información de configuración y, lo más importante , un árbol completo de la historia de todos los cambios realizados en la base de código, los cambios específicos se hicieron en los cambios específicos. quien los hizo y cómo se integraron nuevamente en el flujo primario de código de las "ramas" temporales donde los desarrolladores pueden trabajar en copias aisladas del código sin interferir con otros desarrolladores que trabajan en la misma base de código.
Para realizar cambios en el sitio web y ver el efecto que tienen esos cambios, deberá descargar el código fuente a su máquina local en lo que se llama operación de "clon" . Esto descargará una copia del repositorio de código fuente en su sistema de archivos y permitirá que sea administrado por Git:
C:dev ; personalmente mantengo mis repositorios en C:DevelopmentRepositories ).C:dev ):cd /c/devgit clone [email protected]:Stack-in-a-box/triumphmayflowerclub.com.gityes y presione [ENTER] .cd triumphmayflowerclub.comCuando haya descargado una copia local del repositorio, debe configurar Git de modo que lo acredite automáticamente como autor de cualquier cambio de código que realice:
<name> con su nombre y apellido:git config --local user.name "<name>"<email> con la dirección de correo electrónico que utilizó para registrar su cuenta de GitHub (no necesita las cotizaciones a ambos lados de la dirección de correo electrónico, como con la configuración de su nombre en el paso anterior, ya que no contiene ningún espacio)::git config --local user.email <email>Jekyll es lo que se conoce como un "constructor de sitios estático" . Nos permite reducir la cantidad de código repetido a lo largo de la base de código, "factorizando" las partes comúnmente utilizadas de una página (como la imagen del título, la barra de navegación, el pie de página de la página, los estilos primarios, etc.) en archivos individuales que simplemente se hacen referencia en páginas específicas; Luego, cuando Jekyll se ejecuta para "construir" el sitio, volverá a insertar el código factorizado en cada uno de los archivos de origen que lo hacen referencia, creando un conjunto reconstruido de archivos que luego se pueden implementar en el servidor en vivo y abrir en un navegador web.
( Nota: Al momento de escribir, en julio de 2020, Jekyll no admite completamente WSL 2, ya que no recibe todos los eventos de actualización del sistema de archivos que se requieren para la función jekyll serve que permite la reconstrucción automáticamente activada cada vez que los archivos de origen cambian, así que siga WSL 1 para el tiempo).
Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linuxbash , que debería verse algo así como <username>@<machine>:~$ , ejecute el siguiente comando para actualizar la lista de paquetes que se pueden instalar y repositorios para instalarlos (ingrese su contraseña de UNIX cuando se le solicite). Esto llevará un tiempo completar:sudo apt-get update -y && sudo apt-get upgrade -ysudo apt-add-repository ppa:brightbox/ruby-ng (Presione [ENTER] para confirmar)sudo apt-get updatesudo apt-get install ruby2.7 ruby2.7-dev build-essential (ingrese "y" cuando se le pide)sudo gem updatesudo gem install jekyll Una vez que Jekyll haya terminado de instalar, en una sesión de terminal de Ubuntu, y suponiendo que elija C:dev como su ubicación para almacenar sus repositorios, realice los siguientes pasos para escindir una instancia de servidor de desarrollo local:
cd /mnt/c/dev/triumphmayflowerclub.comjekyll serveServer running... press ctrl-c to stop. se mostrará. En este punto, abra un navegador web y navegue a http: // localhost: 4000/para ver el sitio web que se ejecuta localmente desde su copia local del código fuente....done in x seconds. Se mostrará, donde x es el número de segundos que se necesitó para generar los nuevos cambios). En este punto, puede actualizar la página cargada en su navegador y los cambios aparecerán en el sitio.( Nota: Jekyll no siempre nota cuándo se crean nuevos archivos, por lo que si actualiza su navegador y la página no es accesible, intente cerrar Jekyll y ejecutarlo nuevamente, y la nueva página debe incluirse en la compilación).
He recomendado algunas herramientas que quiera usar para el desarrollo. No se requiere nada de estos, pueden facilitar el trabajo en el sitio.
Necesitará un navegador web, preferiblemente uno basado en Chromium, como Microsoft Edge (incluido con Windows 10) o Google Chrome, para probar cualquier cambio que realice en el sitio web antes de comprometerlos con la base de código.
Si va a modificar el código fuente del sitio web, necesitará un buen editor de texto. Recomiendo usar el código Visual Studio, ya que es moderno, liviano, multiplataforma y tiene muchas características que generalmente encontraría en un IDE totalmente completo, como resaltar sintaxis, finalización del código, Intellisense y un gran ecosistema de complementos. Para el desarrollo simple del sitio web utilizando Vanilla HTML, CSS y JavaScript muy ocasional, debería funcionar extremadamente fuera de la caja sin ningún cambio de configuración o complementos adicionales:
No es una necesidad, pero puede ser útil al autorizar artículos de noticias o contenido para su inclusión en el sitio, ya que agrega automáticamente los caracteres unicode tipográficos que son requeridos por nuestros estándares de código (para ser documentado en algún momento en el futuro), como "citas inteligentes" , daños, etc. La versión completa de Word es obviamente un software pagado como parte de la suite de la oficina, pero es una gran cantidad de funciones de decente, de forma gratuita, libre, de forma gratuita, de la alternativa, es obviamente el software pagado.
Photoshop es lo que uso para la edición de fotos, pero la mayoría de los editores deben hacer un buen trabajo de tareas de edición simples.
Mi visión para este proyecto, a medida que evoluciona, es que comenzará a atraer a un pequeño equipo central de desarrolladores y colaboradores no técnicos, de modo que se convierte en un gran lugar donde los que desean ensuciarse las manos con algún desarrollo de sitios web de código abierto pueden hacerlo. Tener más miembros del equipo también me liberará para trabajar en adiciones de características, refactores importantes e integrar nuevas tecnologías.
Eventualmente, sería genial si tuviera tiempo para desarrollar un conjunto simple y a medida de herramientas de autoría estilo CMS que permitiera a los miembros del club no técnico autor y enviar artículos de noticias y otro contenido para su inclusión en el sitio con intervención técnica mínima o incluso cero. Tal como está, el sitio necesitará una actualización manual de la gente de mentalidad técnica en el futuro previsible, pero con suerte llegaremos a esta etapa algún día.
Para implementar el sitio de puesta en escena o en vivo, realice lo siguiente:
jekyll build_site en la raíz de su repositorio, ya que aquí es donde Jekyll coloca el resultado del proceso de generación de sitios.beta.triumphmayflowerclub.com o public_html , dependiendo de si se está implementando en el sitio de puesta en escena o en vivo, respectivamente.index.html y cambie el nombre updating.html a index.html . Idealmente, esta sería una operación atómica para minimizar el riesgo de que alguien no pueda cargar la página de inicio, pero el plazo en el que esto sucede y las relativamente pocas personas que acceden a nuestro sitio web significan que esto no es realmente un problema en la práctica. Esto se abordará correctamente una vez que comencemos a usar acciones de GitHub para la implementación continua.index.html , y arrastiéndolos al panel de destino de la derecha.index.html desde el panel de origen al destino uno para sobrescribirla. La implementación ahora está completa. Si necesita ponerse en contacto conmigo (Andi Emma Davies-Wilcox-Desarrollador principal), hágalo en la siguiente dirección de correo electrónico: [email protected]
Copyright © Stack-in-a-Box Software 2017–2021
Copyright © Triumph Mayflower Club 2005-2021