Wie wir Habr for Humanities ins Leben gerufen haben

    „In den nächsten zwei Jahren sollte man nicht versuchen, etwas Besonderes vorzutäuschen, sondern nur klug genug sein, um zu komponieren, was die Menschheit bereits geschaffen hat“ (c) bobuk

    Vor einem Jahr haben unsere Rostower bei einem internen Hackathon über Nacht einen visuellen Texteditor, Muravyevs Typograf und einen Plagiatsdienst überquert. Es stellte sich heraus, dass die Veröffentlichung schnell vorbereitet und an den Blog gesendet werden konnte.

    Zu einer Zeit lebte das Ding als Nebenprojekt, dann erhielten wir ein paar Ressourcen - na ja, wie ein internes Startup. Das Ergebnis war ein komfortables kollektives Medium ohne Redaktion.


    Der alte Mann Gutenberg würde sich freuen, denn er

    ermöglicht es den Menschen, unterhaltsame Geschichten zu lesen, wie etwa einen 40-jährigen Onkeltaucher, der in der Barentssee versunkene Schiffe züchtet, und Schriftsteller zu beliebten nichttechnischen Themen, die mit Texten ein wenig Geld verdienen.

    Mal sehen, was bei der Entwicklung eines solchen Dienstes zu beachten ist und was man damit ohne Krücken auswählt.

    Aus Tradition haben wir den Beitrag in Kapitel unterteilt - jedes hat Tipps und eine direkte Ansprache des Projektteilnehmers mit einem Minimum an externen Kommentaren.

    Warum sollten Sie aus 10 Editoren Medium (JS) auswählen ?


    Dank an Muravyov für den Typographen (Python)


    Wie das Plagiatbekämpfungssystem funktioniert (Pytnon)


    Wie kann ein Autor verstehen, welche Wirkung Texte haben?


    Wie man es unterstützt (über die Arbeit mit Systemadministratoren)


    Die Geschichte von Onkel Diver (auf uPages)


    Aber fangen wir von vorne an. Als sich das Nebenprojekt zu einer hoch belasteten Plattform entwickelte, bestand Einigkeit darüber, dass etwas hinzugefügt und neu geschrieben werden musste.

    0. Wie haben wir uns für Technologie entschieden?


    Wir gehen davon aus, dass bis Ende des Jahres 8.000 Autoren die Plattform nutzen und sich die Leserschaft 300.000 nähern wird.

    Ilya devhard , CTO uPages: „Bei der Auswahl der Technologien für das Projekt gingen wir von solchen Überlegungen aus: vielversprechend und widerstandsfähig gegen schwere Lasten.

    Die Wahl fiel auf eine Reihe von Node.js + MongoDB. Es gibt keine Winkel, Reaktionen, Reduzierungen auf den Kunden. Express.js wurde aufgrund seines Minimalismus und der Verfügbarkeit von allem, was Sie benötigen, ab Werk oder mit kleinen zusätzlichen Einstellungen als Framework ausgewählt.

    Wir hatten auch ESlint- ein Dienstprogramm, das sehr dazu beigetragen hat, den Code mehrerer Entwickler auf einen mehr oder weniger einheitlichen Stil zu bringen, ohne dass viel darüber diskutiert wird, "was besser ist: Tabulatoren oder Leerzeichen". Sehr nützlich in den frühen Stadien der Entwicklung.

    ESlint hat eine Demo auf der Seite. Sie können das Projekt von GitHub herunterladen.

    Docker- Container - als Arbeitsumgebung für Projektanwendungen - schützen sich vor Paranoia wie „Aktualisieren der Bibliothek und alles bricht zusammen“ und erhalten bei Bedarf schnell die richtigen Bibliotheksversionen oder sogar mehrere vollständig unterschiedliche Assemblys (grob gesagt, stabile und Bleeding -edge-Assemblys).

    Wir hatten auch 3 Git-Repositorys (eines lokal im Büro, zwei in verschiedenen Rechenzentren). Und ich wusste, dass wir eines Tages anfangen würden, einen visuellen Editor zu schreiben. “


    1. Wenn Sie sich dazu entschließen, Ihr eigenes WYSIWYG zu schreiben, haben wir Verständnis für Sie


    Sergey, unser Entwickler: „Der Prototyp des Hackathons wurde für Blogs und Websites auf uCoz erstellt. Und natürlich war das erste, was wir dachten, etwas von dort zu nehmen. Aber, wie Sie wissen, ist ein Teil von uCoz in Perl geschrieben - und wir haben uns für Node.js entschieden. Der Editor müsste also als separater Dienst verbunden oder neu geschrieben werden.

    Nachdem ein Dutzend weitere Optionen geprüft wurden, wurden sie ebenfalls verworfen, weil:

    1. Entweder waren sie keine Redakteure, die etwas sehen und bekommen konnten.
    2. Oder out of the box sah nicht modern aus, sondern wie Word 2003.
    3. Jedes Anpassen ist wie ein Kostümieren.

    Sie finden eine Liste von Redakteuren, die wir im ersten Kommentar nicht empfehlen, aber wir eröffnen gleich eine:


    CKEDITOR ist nicht Ihr Bruder (zumindest aus Grund 2) Die

    Autoren auf der Website werden unterschiedliche Personen sein - sowohl professionelle Journalisten als auch Texter und absolut Neulinge und diejenigen, die in den harten 2000er Jahren versucht haben, zu bloggen. Ich wollte den Editor so gestalten, dass jeder den Artikel schnell und ohne großen Aufwand herunterladen kann.

    Nach erneuter Suche stellten wir fest, dass im Frühjahr 2016 die Wahl klar war - der Medium Editor , ein Open-Source-Editor, der von der beliebten gleichnamigen Blog-Plattform inspiriert wurde. Auf den ersten Blick hat es einige Vorteile.

    Bei mirVollständige und verständliche Dokumentation, das Projekt wird ständig aktualisiert, es wird nicht aufgegeben. Er hatte auch die notwendigen Funktionen "out of the box" (Symbolleiste und Werkzeuge für die Arbeit mit Text - das ist, was auf GitHub ist) und die Möglichkeit der Anpassung.


    Bearbeitungswerkzeuge werden nur bei Bedarf angezeigt. Hinter dem Pluszeichen an der Seite befindet sich das Einfügen von Fotos und Videos.

    Widgets, die nicht im Kit enthalten waren - "Video", "Bilder" und "Separator" - habe ich selbst geschrieben, ausgehend vom Design. Und ihre Erstellung dauerte nicht viel Zeit.

    Aber nicht ohne eine Fliege in der Salbe. Die erste Überraschung war die Tatsache, dass ME die Standardereignisse innerhalb des Editors - Keyup, Paste usw. - neu definierte und durch eigene ersetzte. Um die Situation in den Griff zu bekommen, musste ich in den ME-Code gehen und eine Ausnahme hinzufügen.


    Nachdem wir die Sicherheitslücke entdeckt hatten, schrieben wir an diejenigen, die ME in Projekten verwenden, und erklärten, wie man sie schließt.

    Bei den ersten Tests wurde eine Sicherheitslücke entdeckt. Wir haben festgestellt, dass es in ME keinen Schutz vor gefährlichen Links gibt, wie zum Beispiel:

    javascript:alert('xss http://www.ru')

    Dies kann durch einfaches Verfolgen und Auflösen von Sequenzen des Typs Javascript gelöst werden, wie wir es getan haben.

    Einerseits machen wir es grob - im Falle eines gefährlichen Links versuchen wir einfach nicht, den Artikel zu speichern. Wenn sich eine Person dagegen für die Durchführung eines solchen Experiments entscheidet, ist sie eindeutig nicht unser Benutzer.


    2. Anstelle eines Bindestrichs werden Anführungszeichen für Fischgrätenmuster und Bindestrich verwendet


    Peter, unser Entwickler: „Im Allgemeinen ist es erwähnenswert, dass die Textverarbeitung in einer natürlichen Sprache keine triviale Aufgabe ist, insbesondere im Hinblick auf die russische Sprache. Es war offensichtlich - verzögern Sie nicht die Entwicklung von Versuchen, etwas anderes zu tun, da Sie fertige Tools mit der von uns benötigten Funktionalität verwenden können.

    Es wurde beschlossen, uns aus dem Hackathon bekannte Versorgungsunternehmen vorzustellen. Wir haben sie in Form eines Docker-Containers in einen separaten Microservice gesteckt - eine Art Python-Wrapper, dessen API über WSGI funktioniert.



    Eines der Werkzeuge war die Druckerei Muravyova . Meiner bescheidenen Meinung nach gibt es in Runet kein besseres Tool für die Typografiekorrektur: eine beeindruckende Zusammenfassung der Regeln, Implementierungen in PHP und Python. Und was sehr wichtig ist, ist die Lizenz.

    Zu Ehren von @emuragev wird es als public domain (public domain) verteilt. Wir haben es daher in einer Python-Implementierung in unser Projekt aufgenommen und fixiert. Bisher haben sie nichts geändert, obwohl es eine Gelegenheit und Ideen gibt, wie die Regeln ergänzt werden können. “


    3. Wie vermeide ich, SEO-Content-Farm zu werden?


    Um zu verhindern, dass Graphomanen und Amateure von gemütlichen Blozics erneut posten, haben wir die Vormoderation eingeführt. Der Text von Veröffentlichungen wird auf Eindeutigkeit überprüft: Sowohl der Autor selbst als auch wir können eine solche Überprüfung durchführen.



    Peter, unser Entwickler: „Das Konzept der Plattform besteht in unterhaltsamen Geschichten und Rezensionen ohne strikte Regulierung von Themen und Formaten. Aber auch wir geben auf jeden Text zu verdienen. Und es ist klar, dass es einzigartig sein muss.

    Um Online-Funktionen zur Überprüfung der Eindeutigkeit von Text zu implementieren, benötigen Sie im Allgemeinen die Yandex.XML- Technologie und im Idealfall eine Basis von Textmustern, um zuerst Text darauf auszuführen und erst dann Y.XML zu aktivieren.

    Die Anzahl der Anfragen von einer Domain an den Y.XML-Dienst ist jedoch begrenzt und hängt direkt von der TCI der Site ab. Und welche Art von TIC kann ein unveröffentlichtes Webprojekt haben? Keine Und während der Entwicklung war es ständig erforderlich, Anfragen zu senden, die Antwort zu analysieren und etwas mit den Daten zu tun.



    Man könnte uns natürlich eine Anfrage von einer Domain unterbreiten, auf der die Seite mit einem großen TIC liegt. Letztendlich haben wir uns jedoch dagegen entschieden und die fertige Content-Watch (CW) -API verwendet. Das System ist bezahlt, aber für uns gingen die Jungs zu Sonderkonditionen.

    Obwohl die Rezensionen im Netzwerk variieren, scheinen sie das Problem gut zu verstehen und haben einen Dienst mit guter Dokumentation, einer minimalistischen API und einigen eigenen Algorithmen zusätzlich zu Y.XML gefilmt.

    Sowohl für uns als auch für die Nutzer ihres Dienstes funktioniert alles sehr einfach - wir senden eine Anfrage für einen CW-Dienst mit dem zu überprüfenden Text und erhalten dann eine Antwort von json. Die Antwort enthält Informationen zum Eindeutigkeitsgrad des Texts (wir zeigen ein schönes Tortendiagramm) und Links zu Seiten im Netzwerk, auf denen dieser oder jener Text zu finden ist. Bisher verwenden nur Moderatoren das Thema mit Links, die die Artikel überprüfen, bevor sie auf der Hauptseite veröffentlicht werden. “


    4. Wie können Autoren Artikel analysieren?


    Um die Autoren interessanter zu machen, haben wir uns entschlossen, Textanalyse- und Zahlungstools für jedermann einzuführen. Das Einkommen wird wie folgt generiert: Neben dem Text befinden sich zwei Banner - Werbung und Empfehlung. Das Banner hat einen Klickpreis (dieser wird vom Werbesystem festgelegt) - wir geben 80% der Kosten für jeden Klick an den Autor weiter.

    Ilya, CTO uPages: „Es war eine interessante Aufgabe, dem Autor zu zeigen, wie viel und wann er verdient hat, und gleichzeitig zu zeigen, dass nicht jeder den Artikel liest, und man muss lernen, sich mit dem Text auseinanderzusetzen, und nicht nur mit dem Teaser und der Überschrift.

    Aus diesem Grund haben wir ein Statistikmodul erstellt.



    Es besteht aus einem Client-Teil - wir zeichnen Diagramme durch Chart.js und geben Zahlen und Listen an.

    Auf der Serverseite betrachten wir etwas selbst - die Anzahl der Likes, Reads, Bookmarks zum Beispiel.

    Und ein Teil der Daten - etwa Klicks auf Banner, mit denen der Autor verdient - werden über die Google Analytics-API und den Engageya-Empfehlungsservice abgerufen. Die zweiten haben keine praktische API, aber es konnte vereinbart werden, dass sie uns einmal am Tag Berichte mit allen erforderlichen Informationen hochladen. So zeigen wir Werbeklicks auf der Artikelseite und das Einkommen des Autors.



    Im Fall der Google-API werden Anforderungen mit einer bestimmten Periodizität geliefert, um die Grenzwerte einzuhalten.
    Ja, die Google-API ist ein Schmerz . Bei so vielen verschiedenen Produkten müssen Sie eine Vielzahl von Dokumentationen erneut lesen und verschiedene Ansätze ausprobieren. Zunächst haben wir versucht, mithilfe der AdSense-Verwaltungs-API AdSense-Umsatzdaten abzurufen. Ihre Berichte können jedoch keine Informationen zur detaillierten Abrechnung von Umsatzquellen enthalten.

    Nachdem ich lange gegoogelt und meinen Kopf auf die Tastatur geschlagen hatte, kam die Erlösung von der Analytik.
    Es wird eine Verknüpfung zwischen Ihren Google Adsense- und Analytics-Konten hergestellt. Danach stehen AdSense-Daten zur Verfügung, wenn Sie Analytics-APIs anfordern. "


    5. Wie man es wartet



    Ruslan pys , Systemadministrator: „Die Aufgabe deutete subtil an, dass es sich um einen Cloud-Server handeln sollte. Nun, ich wollte nicht wirklich die gesamte Temperaturüberwachung des Motherboards, die Lüftergeschwindigkeit, die Überwachung der Festplatten durchführen - und sie austauschen, ohne zu vergessen, die Seriennummern neu zu schreiben.

    Wir haben die folgenden Anforderungen an virtuelle Cloud-Maschinen gestellt:

    • Rechenzentrum in Moskau (weil wir ein russischsprachiges Publikum haben),
    • bequeme Konfigurationsänderung,
    • zwei Server von unterschiedlichen Anbietern - für Fehlertoleranz und die Möglichkeit des technischen Arbeitens ohne Ausfallzeiten.



    Eine weitere wichtige Aufgabe war das Software-Bereitstellungsmodell. Offensichtlich sind das Leben auf dem Entwicklungsserver und im Kampf zwei große Unterschiede. Es ist gut, dass sich die Jungs sofort für die universelle Containerisierung entschieden haben - wofür sich die gesamte Systemadministration bei dieser Gelegenheit bedankt.

    Wir haben Saltstack als Container-Deployment- und Konfigurations-Management- System gewählt , weil wir es bereits in anderen Projekten erfolgreich eingesetzt haben.

    Infolge der Alarmierung des Dienstes entstand ein natürlicher Wunsch, Übungen durchzuführen, d.h. Schießen von Yandex.Tank. In Experimenten mit einem anderen Verhältnis von Anforderungen an die Prozessorkerne und Einstellungen von System- und Anwendungssoftware haben wir die Kapazität eines Knotens und die Korrelation dieser Kapazität mit der Konfiguration der virtuellen Hardware und den Betriebssystemeinstellungen ermittelt. Nun, sie haben am 1. November angefangen. “

    PS Senden Sie Ihre http-Anfragen an unseren neuen Service !

    Jetzt auch beliebt: