Wochen-Ziele:
- Blog-Projekt-Tagebuch (Mai) in den Blog uploaden
Tages-Ziele:
E-Mail-Button
Da ich gestern bereits eine E-Mail-Adresse eingerichtet hatte, fehlte heute nur noch der dazugehörige Button. Der war auch schnell erstellt. Einfach den SupportButton kopiert und etwas angepasst.
Dann konnte ich den E-Mail-Button in die SocialLinks integrieren. Da ich aber nicht überall wo die SocialLinks angezeigt werden, zwingend den E-Mail-Button mit anzeigen möchte, hab ich die SocialLinks fix um eine showEmail-Property ergänzt.
Codewars-Button
Da ich gerade dabei war, hab ich Codewars zu den SocialLinks hinzugefügt. Auch diesen Button brauche ich nicht überall, darum hab ich auch für Codewars eine entsprechende showCodewars-Property zu den SocialLinks hinzugefügt.
Auto-Betreff
Weil ich Automatisierung so geil finde, hab ich den E-Mail-Button so eingerichtet, dass automatisch eine Betreff-Zeile für die E-Mail generiert wird wenn man drauf klickt. Abhängig davon, wo auf der Seite man sich gerade befindet.
Feedback-Section
Danach hab ich ans Ende jedes Blog-Artikels eine Feedback-Section angehängt, die hinter einem Accordion versteckt ist. Wenn man es öffnet, findet man die SocialLinks inklusive E-Mail und Codewars.
Wie ich das Accordion erstellt hab findest du hier.
Daten von Codewars-API fetchen
Dann hab ich angefangen mich um das automatische Fetchen derCodewars-Daten, vor allem der Kata-Beschreibung, zu kümmern.
Da ich gestern bereits die Kata-id in das Frontmatter integriert habe, kann jetzt mit dieser id das richtige Kata gefetcht werden.
react-markdown
Einzig das Rendern des Markdowns in der Beschreibung wollte noch nicht so richtig funktionieren. Darum hab ich das Package react-markdown von remarkjs installiert.
Dazu hab ich noch eine Komponente erstellt, die die gefetchten Daten rendert. Je nachdem ob es normaler Text oder Markdown ist, werden die Daten von react-markdown gerendert oder einfach nur dargestellt.
Jetzt kann die API beim Build-Prozess angezapft und die Daten automatisch gerendert werden. Ich muss also nicht mehr jede einzelne Kata-Beschreibung in die Blog-Posts kopieren. Nice 😎
So richtig fertig bin ich aber nicht geworden, weiter geht’s damit dann nächste Woche!