NichePlayer

Ik ben begonnen met een nieuwe versie van de NichePlayer. Tijdens mijn bachelor heb ik een versie gemaakt die werkte als Proof of Concept. Er waren echter een aantal (software) problemen, waardoor het noodzakelijk was om opnieuw te beginnen.

Om voor volgende projecten toekomst-bestendig te zijn, heb ik besloten de basis functies van de NichePlayer los te halen. Hierdoor kan ik de ‘core’ van het systeem hergebruiken in andere projecten en hoef ik niet iedere keer opnieuw het wiel uit te vinden.

Core Development

De core bestaat uit zaken als user login, admin paneel en de API.

Het admin paneel wordt ontwikkeld via het CRUD (Create, Read, Update, Delete) ontwerp. Omdat de backend gebaseerd is op een relational database wordt er binnen het admin paneel gebruik gemaakt van relatie velden. Deze relatie velden kunnen algemeen worden ontwikkeld. Als er in latere ontwikkeling een relatie veld nodig is kan deze snel worden gemaakt.

Libraries

Voor de core van dit systeem wordt een combinatie van Quasar (frontend) en API-platform (backend) gebruikt. Deze frameworks kunnen via een GraphQL API makkelijk aan elkaar gekoppeld worden. In de NichePlayer wordt een MVC (Model View Controller) ontwerp gehanteerd.

Quasar Framework

Door positieve ervaringen uit vorige projecten heb ik er voor gekozen de frontend van de NichePlayer te ontwikkelen met het Quasar Framework. Dit javascript framework gebaseerd op VueJS implementeert de Material Design Guide, waardoor het bouwen van een UI eenvoudig is. Quasar zelf is geschreven op het VueJS Framework.

In VueJS wordt de layout opgebouwd uit components, losse blokken code voor bijvoorbeeld een button of een header bar, wat goed aansluit bij de wensen van een creatief platform. Verder is VueJS reactive, wat betekend dat variabelen als een boomstructuur worden doorgegeven aan de verschillende components. Hierdoor blijft de code overzichtelijk.

API-Platform

Onder de motorkap is API-Platform gebaseerd op Symfony Framework, een PHP library wat wordt gebruikt in veel bekende systemen waaronder Nextcloud. Door het systeem te ontwikkelen in PHP is het makkelijk te installeren op verschillende LAMP servers. Binnen API-platform kan makkelijk een API worden ontwikkeld.

GraphQL

GraphQL is een query language voor APIs. In de request wordt meegegeven welke velden en tabellen nodig zijn. De server bouwt vervolgens op basis van deze aanvraag een response. De client krijgt een samengevoegd json object met de velden en relaties die zijn opgevraagd. Op de client wordt deze vervolgens uitgepakt en opgeslagen in een locale opslag.

Content Management System

Naast dat de NichePlayer muziek kan afspelen, is het ook een plek voor artiesten om zich creatief te kunnen uiten. De NichePlayer wordt een CMS. Een Content Management System is een software pakket waarbinnen mensen met geen of weinig technologische kennis een website kunnen opzetten en beheren. Bekende voorbeelden van een CMS zijn WordPress, Joomla, DocuWiki en Grav.

Binnen de NichePlayer kan de beheerder pagina’s aanmaken en bewerken. Deze pagina’s zijn opgebouwd uit widgets. Voorbeelden van algemene web widgets zijn headers, tekst, of afbeeldingen en slideshows. Daarnaast zullen er ook een aantal widgets ontwikkeld worden die de NichePlayer omvormen van een traditionele CMS naar een streaming service.

Om het systeem extra persoonlijk te maken kunnen de kleuren worden aangepast. Deze kleuren worden gebruikt als primary en secondary color, en zijn aan te passen met een color picker. Later kunnen hier ook andere thema zaken bij komen zoals fonts, background color of image, app image en dark mode.