podcastrnext Download - podcastrnext Quellcode herunterladen

podcastrnext

Website-Daten

1.0.0

Herunterladen

Das Beste für dich zuzuhören immer

? An

Podcastr

Podcastr ist das Projekt, das während der neuen Woche der neuen Edition React Of Next Level , einer Online -Veranstaltung von RocketEse , entwickelt wurde.

Dies ist eine Webanwendung, mit der Benutzer ihre bevorzugten Podcasts anhören, die neuesten Veröffentlichungen sehen und weitere Informationen aus den Podcasts erhalten, die sie derzeit hören.

Podcastr - Podcast -Detail -Seite

Dieses Projekt war sehr interessant zu entwickeln, da wir für die Entwicklung des Audio -Players die HTML5 -API verwendet haben, um den Audio zu manipulieren, der vom Benutzer gespielt wird, sowie die Ereignisse und Staaten des Spielers. Darüber hinaus war es möglich, mehr über Next.js zu erfahren, ein Framework -React, der die Erstellung von Webanwendungen mit SSR (Server -Side -Rendering) ermöglicht.

Besonderheit

Listen Sie die neuesten Podcast -Veröffentlichungen auf
Ausgewählte Podcast -Details
Aktuelles Datumsanzeige
Spieler mit Shuffle -Funktionen, Wiederholung, vorheriger, in der Nähe und Spiel/Pause sowie der Fortschritt der Episode
Responsive Layout

Podcastr

Dunkler Modus / Lichtmodus (Schalter)

Technologien und Tools verwendet

Dieses Projekt wurde mit den folgenden Technologien und Tools entwickelt:

React : Eine Open -Source -JavaScript -Bibliothek, die sich auf das Erstellen von Benutzeroberflächen auf Webseiten konzentriert. Es wird von Facebook, Instagram, anderen Unternehmen und einer Community einzelner Entwickler gepflegt. Es wird auf Netflix, Imgur, Feedly, Airbnb, Seatgeek, Hellosign, Walmart und anderen verwendet;
NEXT.JS : Ein Front-End-Webentwicklungs-Framework, das dem React neue Funktionen hinzufügt, wie z. B. Server-Side-Rendering (SSR) und SSG (statische Site-Generierung). Wir verwenden dieses Tool, das die Leistungsoptimierung und eine bessere Indizierung in Suchmaschinen (SEO - Suchmaschinenoptimierung).
TypeScript : Ein supersatz von JavaScript -Sprache, der Klassen, Schnittstellen und optionale statische Typisierung liefert. Verwendet in Verbindung mit React an der Web -Frontand;
SASS : Ein CSS-Pre-Processor, der die herkömmliche CSS-Syntax erweitert und uns eine professionellere und dynamischere Kontrolle für die Style-Blätter gibt.
AXIOS : Es ist ein HTTP -Client, der auf Versprechen basiert, Anfragen zu stellen.
GIT : Das am häufigsten verwendete Open -Source -Steuerungssystem;
Visual Studio -Code : Ein von Microsoft für Windows, Linux und MacOS entwickelter Quellcode -Editor, der für die Entwicklung von Webanwendungen empfohlen wird;

? Layout

Das Layout von PodcaStr -Anwendungsbildschirmen wurde vom Rocketat -Team über das Figma Online -Tool entwickelt, eine Prototyping -Software, die sich auf UI -Design (Benutzeroberflächendesign) konzentriert. Sie können über diesen Link auf das Layout zugreifen: Podcastr .

? Installation und Ausführung

Um die Projektquelle auf Ihrem Computer herunterzuladen, müssen Sie zuerst Git installiert haben.

Führen Sie mit dem installierten Git auf Ihrem Terminal den folgenden Befehl aus:

git clone https://github.com/mathrb22/podcastrnext.git

Um die Räumlichkeiten zu installieren und das Projekt auszuführen, müssen Sie den Node.js installiert haben, der vom NPM begleitet wird. Damit installiert:

Installieren Sie die Projekteinrichtungen:

npm install

Führen Sie das Projekt aus:

npm run dev

# ou

yarn dev

Wie man beiträgt

Machen Sie eine Gabel von diesem Repository;
Erstellen Sie eine Filiale für Ihre Funktion: git checkout -b minha-feature ;
Machen Sie sich mit Ihren Änderungen fest : git commit -m 'feat: Minha nova feature' ;
Drücken Sie nach Ihrem Zweig: git push origin minha-feature ;
Anfrage mit Ihrer Funktion ziehen ;