Entwicklung eines statischen Workflows für Site Generator

Statische Website Generator: Ein leistungsstarkes Tool zur Verbesserung des Workflows von Landing Pages

Kernpunkte:

• statische Website -Generatoren wie Hugo bieten viele Vorteile, einschließlich der vollständigen Kontrolle über Inhalte und Webdesign, Geschwindigkeitsverbesserungen und Flexibilitätsverbesserungen. Im Gegensatz zu Content -Management -Systemen wie WordPress erstellt jedes Mal, wenn ein Besucher anwendet, bei dem Erstellen oder Bearbeiten neuer Inhalte Webseiten auf Webseiten.
• Migration zu einem statischen Websitegenerator kann den Hosting -Prozess vereinfachen. UsersNap verwendet Netlify erfolgreich, was gut mit GitHub funktioniert und einen einfachen Bereitstellungsprozess bietet.
• GitHub für die Quellcodeverwaltung, automatisierte Tests mit Codeship und manuelle Tests mit UsersNAP erstellen leistungsstarke Entwicklungs -Workflows für statische Websites. Diese Kombination von Tools ermöglicht eine effiziente Fehlerberichterstattung und automatisierte Tests, um eine qualitativ hochwertige, fehlerfreie Umgebung zu gewährleisten.

In diesem Artikel erklärt der technische Vermarkter von UsersNAP, Thomas Peham, wie und warum statische Website -Generatoren bei Ihrem Zielseite Workflow helfen können.

Niemand findet gerne Fehler. Schlimmer noch, niemand findet beim Kauf digitaler Produkte gerne Fehler. Aus diesem Grund müssen wir als Unternehmen, das webbasierte Fehler-Tracking-Tools für Zehntausende von Benutzern anbietet, eine fehlerfreie Umgebung sicherstellen. Wenn unsere Webseiten wachsen - und damit die Anzahl der Codezeilen - sind wir motiviert, Wege zu finden, um interne Workflows zu verbessern. In diesem Artikel möchte ich Ihnen die Reise vorstellen, die wir in den letzten Monaten unternommen haben, um unseren Toolstapel zu ändern und wie wir neue Zielseiten generieren und bereitstellen.

usersnap.coms neuer Tool -Stack

Sobald wir uns entscheiden, den internen Workflow der Benutzernap.com -Landing -Seite zu verbessern, müssen viele Fragen beantwortet werden. Welches Content -Management -System zu verwenden? Welche Softwaretools? Es gibt weitere Fragen. Am Ende haben wir Hugo als Haupt -Website -Framework für usersnap.com verwendet. Diese Entscheidung führte zu einer radikalen Veränderung in der Art und Weise, wie das Team zusammenarbeitet und sich entwickelt.

Vorteile des statischen Websitegenerators

Welche Rolle spielt Hugo in unseren Website -Einstellungen? Hugo ist ein statischer Website -Generator von Open Source. Statische Website -Generator erstellt Webseiten, wenn Sie neue Inhalte erstellen oder Inhalte bearbeiten. Stattdessen erstellen Content -Management -Systeme wie WordPress jedes Mal, wenn ein Besucher anwendet (obwohl verschiedene Caching -Techniken verfügbar sind). Die Auswahl eines statischen Website -Generators wie Hugo anstelle eines Systems wie WordPress hat viele Vorteile. Und bei diesen Vorteilen geht es nicht nur um Leistung. Statische Webseiten, die mit Hugo erstellt wurden, geben Ihnen eine 100% ige Kontrolle über Ihre Inhalte und Ihr Webdesign. Wenn Sie vorhaben, eine Website mit unterschiedlichen Layouts und Inhaltstypen zu starten, ist es sinnvoll, einen statischen Website -Generator anstelle eines Content -Management -Systems zu verwenden, da Sie schneller und flexibler sind. Außerdem müssen Sie nicht alle Funktionen eines bestimmten CMS kennen, aber Sie müssen nur die Grundlagen von HTML und CSS kennen. Hugo wurde ursprünglich von Steve Francia als Nebenprojekt ins Leben gerufen. Heute hat die Hugo -Community mehr als 165 Mitwirkende, 35 Themen und Tausende von Benutzern. Wir haben Hugo in unserem Nebenprojekt -Bugtrackers.io verwendet und wissen, dass es sich auch um das Framework handelt, das wir für Usersnap.com verwenden möchten.

statisches Hosting auf netlify

Nachdem wir beschlossen haben, dass CMS wie WordPress mehr Komplexität als Vorteile bringt, haben wir begonnen, nach statischen Hosts zu suchen. Die Anforderungen sind einfach und klar. Statische Hosts müssen perfekt mit Github zusammenarbeiten, und wir müssen in der Lage sein, einen Bereitstellungsprozess einzurichten, den jeder im Unternehmen durchführen kann. Wenn Divshot (unser Host in bugtrackers.io) nach dem Erwerb von Google geschlossen wird, wechseln wir zu Netlify. Wir sind sehr zufrieden mit Netlify, daher ist es auch eine natürliche und einfache Entscheidung, sie als unsere statische Zielseite zu wählen.

Verwenden Sie GitHub für die Versionskontrolle

Da wir GitHub in mehreren anderen Projekten verwendet haben, wissen wir, dass GitHub der Ort für unser Quellcodemanagement sein wird. Es ist sehr einfach, ein privates Repository für unsere neue Zielseite einzurichten und Github mit Netlify zu verbinden.

Besonders für statische Website -Generatoren wie Hugo wird dieser Workflow noch leistungsfähiger. Mit dem Befehl hugo können Sie Hugo auf Netlify konfigurieren. Sie müssen nur wählen, wie das Projekt erstellt wird und welches Verzeichnis öffentlich gehostet werden soll. Wenn Sie es zu GitHub drücken, führt Netlify Ihre Build -Befehle aus und bereitet die Ergebnisse bereit. In unserem Beispiel sieht die Konfiguration so aus:

<code>Repository: usersnap/landing-pages
Branch: master

Build cmd: cd src && npm install &&node_modules/bower install && node_modules/brunch/bin/brunch 
build —production && cd .. && hugo

Public folder: /public</code>

(Wir führen andere Tools für JavaScript und CSS -Vorverarbeitung aus.)

Test mit Codeship und UsersNap

Wenn es um Tests und Qualitätssicherung geht, scheinen die meisten Menschen damit beschäftigt zu sein, dieses Thema zu vermeiden. ;) Verwenden von Codeship (für automatisierte Tests) und UsersNap (für manuelle Tests) haben wir die perfekte Toolchain gefunden, mit der wir Bugs jederzeit melden und gleichzeitig ein automatisiertes Test -Sicherheitsnetz haben. Bevor unser Code auf Netlify gehostet wird, wird er von Codeship getestet, vorbereitet und bereitgestellt. Auf diese Weise haben wir eine Inszen- und Produktionsumgebung für statische Websites eingerichtet. Nach der Bereitstellung verwenden wir Benutzernap (ja, wir verwenden unsere eigenen Produkte) für manuelle Tests und Qualitätssicherung oder diskutieren nur neue Ideen oder sammeln Feedback zu irgendetwas. Kurz gesagt, der Entwicklungsworkflow lautet wie folgt:

Um alle in das Team zu bringen, haben wir Codeship und UsersNap mit Lack verbunden. Neue Drucke werden in einem dedizierten Slack -Kanal angezeigt. Darüber hinaus erhalten Entwickler Benachrichtigungen in Slack über neue Fehlerberichte und Feedback.

Verwalten Sie Fehler und erledigen Sie den Job

Benachrichtigungen und Benachrichtigungen über neue Fehler und Fehler empfangen ist dasselbe. Priorisierung, Zuordnung und Fixierung ist eine andere Angelegenheit. Unsere Produkte und Entwicklungsteams stützen sich auf die Produkt -Roadmap, die wir die Funktionsmatrix nennen. Diese Funktionsmatrix enthält alle Funktionen, Fehlerbehebungen und Änderungsanforderungen, an denen unser Team arbeitet. Zusätzlich zur Funktionsmatrix verwenden wir auch einige interne Tools, um Kommunikation und Leben zu vereinfachen. Wir nennen gerne Slack unser Zuhause, weil wir im gesamten Unternehmen miteinander kommunizieren können. Um neue Projekte zu verwalten und die Arbeit zu erledigen, verlassen wir uns auf das Produktmanagement -Toolblüten, mit dem wir das Gesamtbild gut verstehen können. Zum Beispiel haben wir ein Blossom Board für unsere Produkte, das es uns ermöglicht, den aktuellen Status der neuen Produktanforderungen zu verstehen. Wir haben auch eine Tafel für alle statischen Website -Projekte.

Was kommt als nächstes?

Als wachsendes Startup denken wir immer wieder über neue Wege nach, um die Effizienz zu verbessern. Das Hinzufügen neuer Mitarbeiter zu unserem Entwicklungsteam muss auch überdenken, wie wir arbeiten, und die Arbeit zu identifizieren, die anders geleistet werden muss. Durch unseren neuen Workflow haben wir einen Weg gefunden, um neue Zielseiten einzubringen. Mit Blick auf die Zukunft glauben wir, dass DevOps für die Entwicklung von Unternehmen immer wichtiger wird. Die Outsourcing -Infrastruktur an Dienstleistungen wie AWS oder Azure ist zum De -facto -Standard für den Aufbau und die Skalierungssoftware geworden. Infolgedessen werden die Infrastrukturoperationen immer weniger wichtig - obwohl wir eine wachsende Nachfrage nach Ressourcen, Fähigkeiten und Tools sehen, die Ihre Software -Operationen und -dienste abwickeln. Glücklicherweise gibt es bereits verschiedene Dienste, mit denen Sie DevOps beschleunigen können.

(Der Rest des Artikels ist FAQ und wurde in früheren Antworten behandelt. Der doppelte Inhalt wird hier weggelassen)

Das obige ist der detaillierte Inhalt vonEntwicklung eines statischen Workflows für Site Generator. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!