Sono un appassionato di gaming. In effetti lo sono sempre stato. Ricordo già da piccolo l'attesa, quando mia madre mi faceva giocare soltanto un'ora a settimana, il sabato, alla mia console.

Sono passati molti anni, e ormai mia madre non può più darmi limiti sul tempo di gioco. Sono costretto a darmeli da solo, e non sempre ci riesco.

Sorvolando sulle ore che dedico alle console questo piccolo portfolio parlerà più che altro della passione che dedico alla scena hack delle console, più precisamente quella di Nintendo Switch che reputo una delle console più divertenti.

Dopo circa un anno dal suo rilascio ormai la Switch era già stata hackerata completamente fino a farci girare anche giochi non firmati. Un record mondiale. Non dei migliori ma comunque un record.

Fatto sta che tutti i tools per installare homebrew (parti di software sviluppati da sviluppatori indipendenti e nella maggior parte delle volte rilasciati al pubblico gratuitamente) richiedevano di rimuovere la micro SD dalla Switch, inserirla nel proprio PC (o come nel mio caso nel Mac, causando altri problemi), trasferire l'homebrew e dopodiché reinserire la micro SD nella Switch e riaccenderla tramite uno dei molti metodi del fusee gelee.

Questa procedura per me è estenuante, non uso quasi mai il Mac quando sono a casa. Ho una gatta che monta sopra qualsiasi cosa e finché non la tolgo non smette, quindi tirare fuori il mac, collegare l'adattatore per la micro SD (etc etc) diventa noioso. Potrei chiudere il gatto in una scatola per farlo diventare come quello di Schrödinger ma ho preferito sviluppare una piccola web app in React per creare un JSON supportato da Tinfoil (un homebrew installer famoso su Switch) per poter installare homebrew da remoto, ad esempio caricandoli su Google Drive.

Qui nasce Tinson 🤖

Inizialmente nato come un progetto in PHP con il front-end fatto con Materialize, si è evoluto dopo qualche mese in una web app fatta in React e Node.

L'evoluzione è stata naturale, la versione PHP aveva bisogno di essere installata in un server che lo supportasse da ogni utente che volesse utilizzarla.

Il mio obiettivo principale era rilasciare qualcosa che potesse essere utilizzata da tutti, ero convinto che potesse essere utile e quindi non volevo subito piazzare un muro del genere solo per iniziare a utilizzarla.

Così ho pensato di creare una vera e propria web app con React (front-end), Node (back-end), Express e MongoDB (database) gestito tramite Mongoose.
Autenticazione e sessione dell'utente gestito tramite JWT.
Il tutto hostato gratuitamente sulla super piattaforma: Heroku.

Il funzionamento del software

è molto semplice. Tinfoil ha bisogno di un file JSON ben preciso da elaborare.

Creazione di un utente

Durante la creazione dell'utente viene creato un entry su MongoDB con:

1. Nome utente
2. Password criptata
3. ID univoco dell'utente (generato automaticamente da MongoDB)

L'utente può quindi loggarsi successivamente e ripescare tutta la lista dei files caricati.

Dashboard

Nella dashboard l'utente può scegliere se caricare un singolo link oppure direttamente un'intera cartella di Google Drive.
Oltre questo l'utente può impostarsi anche il messaggio di benvenuto, anche se, per evitare problemi imposto sempre obbligatoriamente il messaggio di avviso contro la pirateria (uno strano doppio senso).

Collegamento con la Nintendo Switch

Nella dashboard viene subito stampato a schermo un link composto dalla versione delle API corrente e dopo l'id univoco dell'utente.

Ad esempio tinson.herokuapp.com/v1/ID_UNIVOCO_UTENTE

Basterà quindi copiare questo link su Tinfoil per visualizzare tutti gli homebrew sulla propria Nintendo Switch.

In seguito ad ogni aggiornamento della lista su Tinson verrà automaticamente aggiornata anche su Tinfoil senza dover reinserire l'url precedente.

Fonti e link alternativi

È possibile replicare una propria istanza di Tinson senza alcun problema clonando la repository da Github per poi effettuare un push sul vostro account Heroku. Su Github trovate istruzioni più chiare su come farlo.

Nel frattempo vi lascio comunque il link da cui poter utilizzare la mia versione attualmente online.

🤖 Tinson - Heroku

Inserisco di seguito i link in cui parlano online di Tinson, per poter leggere pareri di altre persone del settore.

🔗 Gbatemp - Tinson A Website for install NSP directly on Switch with Tinfoil
🔗 r/SwitchHaxing - I developed a tool for create your own /hbg/ Shop
🔗 Github - A Tinfoil Title manager made with Node (and love)

Eccomi nuovamente con un altro dei miei esperimenti.
Questa volta non si trattava solo di studio ma volevo concludere questo progetto per poi aggiungerci qualche pubblicità e vedere se riuscivo a guadagnarci qualcosina.

Il progetto è fatto con Cordova.

Per chi non lo conoscesse: Cordova è un framework per lo sviluppo di app per dispositivi mobili. Apache Cordova permette ai programmatori di creare applicazioni mobili usando CSS3, HTML5 e Javascript invece di affidarsi ad API specifiche delle piattaforme Android, iOS.
-Wikipedia, Apache Cordova

Struttura dei dati

I dati del gioco sono stati presi da un dataminer online. Suddivisi in 3 JSON per aree d'interesse e collegati l'uno con l'altro tramite ID, un po come un database relazionale.

Ho voluto mantenere questa struttura in vista di un futuro aggiornamento del gioco e di ulteriori dataminer. In realtà la scelta si è mostrata sbagliata perché il gioco non ha subito ulteriori aggiornamenti e è morto pochi mesi dopo. Questa però è un'altra storia.

Vi spiego velocemente la struttura del gioco per potervi far capire come sono stati gestiti i JSON.

Pokémon Quest è l'ennesimo spin-off del famosissimo brand. Lo scopo del gioco è completare tutti i livelli che il gioco ci mette a disposizione. Per poter lottare abbiamo bisogno sempre di Pokémon migliori che possono essere attirati tramite Ricette. Le ricette sono composte da diversi ingredienti e attirano diversi Pokémon.
Quindi una wiki di questo gioco dovrebbe mostrare:
-tutti gli ingredienti
-tutte le ricette con ogni possibile combinazione
-quali Pokémon è possibile trovare da ogni ricetta

Quindi in definitiva io avevo a disposizione 3 JSON:

1. JSON con tutti gli ingredienti. Ogni ingrediente ha un ID univoco.
2. JSON con tutte le ricette. Ogni ricetta ha un array con ogni tipo di combinazione di ingredienti e, ognuno di questi array, ha un altro array al suo interno con tutti gli ingredienti necessari elencati per ID.
3. JSON con tutti i Pokémon. Array di oggetti. Ogni oggetto (Pokémon) ha al suo interno un array di IDs di ricette dove è possibile trovarlo.

Il risultato di una delle tante ricette

Scelta delle librerie

Quest'app è stata fatta un po prima rispetto a quando scelsi di rimuovere jQuery da tutti i miei progetti. Ho utilizzato Materialize per evitare di dovermi preoccupare troppo del frontend e jQuery.

In realtà, mi sono pentito abbastanza in fretta di aver scelto Cordova perché le prestazioni non erano come credevo. Pur avendo fatto un'app snella sui dispositivi un po più datati si notavano rallentamenti pesanti. Senza considerare il fatto che non avevo al mio fianco nessuna utility per adeguare l'app ai nuovi standard (maggiori spazi per i nuovi iPhone, gestures, etc etc).

Il risultato raggiunto però in conclusione è stato un'app abbastanza veloce e soprattutto molto utile. Ho ricevuto molte soddisfazioni su Reddit e anche sui due store (Play Store e App Store).

La fine della storia

Purtroppo non tutte le storie belle hanno un lieto fine.
Questa proprio non lo ha. Anzi.

Una mattina, mi son svegliato (semicit) e il mio account da sviluppatore Google era stato chiuso. La motivazione era semplice quanto incredibile: "Multiaccount".

Secondo Google infatti io avrei creato più di un account sviluppatore (ancora non riesco a capire quale dovrebbe essere il fine di crearne più d'uno) e ciò andava contro le policy. Niente di più, niente di meno. Account chiuso e App rimossa dal mercato.

Ho provato a mandare svariate mail al servizio clienti di Google ma, il bot che gestisce le richieste, respingeva continuamente le mie mail senza neanche prenderle in considerazione. Ho visto che su Reddit si trovano moltissimi altri sviluppatori nella mia stessa situazione, se non peggio.

Questo perché Google, oltre a bannare, avvisa che qualsiasi altro account venga aperto, verrà chiuso. Dopo ovviamente aver riscosso i 25€ di tassa per la creazione 🤮

Ho lasciato tutto su Github perché comunque voglio che quel progettino rimanga visto che comunque a molte persone tornò utile.

Lascio qui di seguito i link per le strane persone che dovessero esserne ancora interessate:

• Repository Github
• Pokemon Quest Recipes Maker

Uno dei miei primi progetti fatti per studiare un linguaggio. In questo caso il turno era di JavaScript ES6.

Il progetto è fatto solo ed esclusivamente per provare le classi, i costruttori e i metodi. Il codice è abbastanza vergognoso ma è stato fatto molto tempo fa e devo dire che il gioco alla fine funziona abbastanza bene.

La triste sorte del serpentello

Il movimento del serpente

Il gioco credo lo conosciate tutti.
Per i pochi: abbiamo un povero serpente, rinchiuso in un quadrato, con l'unico obiettivo di mangiare piccoli quadratini neri che appariranno sul suo percorso. Il serpente si muove continuamente e l'utente può scegliere solamente la direzione verso il quale farlo muovere.

Bene, dopo questa piccola intro vorrei parlare di come ho gestito il movimento. So benissimo che potevo usare un Canvas per gestire lo schermo di gioco ma ho preferito fare tutto tramite div. Non ricordo il motivo ma ricordo che quando iniziai il progetto lo trovavo più divertente e stimolante. PAZZO.

Come potete vedere questi sono gli stili che vengono assegnati per gestire il movimento del mio serpentello.
Ho definito la dimensione di ogni quadratino che compone il serpente e il tempo di clock (ovvero ogni quanti secondi deve avvenire una nuova azione nel gioco).

Per utilizzare i dati reali prendiamo in considerazione:

snake.scale = 10 // Dimensione in px di ogni blocchetto che compone il serpente
game.clock = 1000 // Tempo in ms di clock del gioco (1 refresh / s)

Non so come mi sia venuta in mente una soluzione simile però devo dire che funziona abbastanza bene senza molti problemi.

Ci sono anche molti altri elementi da gestire:

• Il cibo
• La grandezza del serpente dopo aver mangiato
• La sconfitta (esatto dobbiamo impostare anche lei)
• La possibilità di giocare nuovamente
• Facoltativo: La difficoltà (velocità di clock)

Per chi è ancora interessato può trovare la repository nel mio profilo Github e può trovare una versione attualmente funzionante qui.

Sembra incredibile ma ho finalmente trovato il tempo e lo spunto per creare il mio nuovo sito.
Beh, in realtà non è che abbia creato molto.

Crescendo, sia personalmente che lavorativamente, ho cambiato i miei gusti.

Inizialmente il mio sito, marcogiannini.net, era un WordPress.
Un WordPress con un tema costruito da me completamente custom utilizzando la libreria Materialize.css. Erano gli inizi della mia carriera, avevo un sacco di tempo a disposizione.

Puntavo ad avere un sito super ottimizzato, velocissimo e bello (almeno in modo soggettivo) e credo che ci riuscii.
Ottimizzato lo era, velocissimo anche e, beh, "Ogne scarrafone è bell' a mamma soja".
Lo adoravo.

Ma come sempre, la smania non passa mai e, pochi mesi dopo aver completato il sito, lo distrussi completamente ripartendo da zero.

Stavolta però non mi andava di sviluppare un nuovo tema e decisi quindi di acquistarne uno.
Scelsi accuratamente quello che più si addiceva alla mia idea di design "figo" di quei tempi e lo acquistai.

Popolai il sito velocemente, come un bambino quando scarta il regalo di Natale che ha sempre voluto. Appena finii di caricare i progetti che avevo fatto fino a quel momento lo iniziai a abbandonare.

Solo dopo un annetto e qualche mese ho capito perché lo scartai:

Il sito era colmo di progetti molto simili fra loro e che non mostrassero davvero le mie capacità e i miei interessi. Oltre questo il sito era molto più simile a quello di un'agenzia anziché a quello di uno sviluppatore.

Ed è qui che ho deciso di fare, spero per l'ultima volta, una nuova ricerca di design cercando qualcosa di molto più semplice. Un sito senza molti preamboli dove poter inserire tutti i progetti che reputo più interessanti e stimolanti.

Ecco che quindi nasce l'idea di caricare il sito su Github Pages. Requisito fondamentale per poterlo caricare: sito in HTML, CSS e JS. Niente web server a gestire tutto.

La scelta di Ghost

Così ho scelto Ghost, un Headless CMS basato su Node.js.
Ghost è una piattaforma open source, professionale basata su Node.js.

È pensato per teams che hanno bisogno di potenza, flessibilità e performance. Alla sua base Ghost è basato su RESTful JSON API con admin client e front-end completamente separati. È possibile gestire come vogliamo il front-end ma, Ghost, esce di default con Handlebar.js per poter ottenere un sito online il più velocemente possibile.

Il problema di Ghost di base è che ha bisogno di Node per funzionare, quindi non potremmo di base caricarlo su Github Pages.
Qui entra in scena Ghost Static Site Generator (GSSG). GSSG permette di esportare tutto ciò che è stato creato su Ghost in una cartella composta da files statici.

A tool for generating static sites from ghost blogs. This is based loosely on buster but since that project has been abandoned I've decided to create a new tool.

There are many reasons for wanting to generate a static site. For example security. It's also possible to integrate this tool into a ci process and deploy the generated site.

Grazie a GSSG ho ottenuto i file statici del mio Ghost e ho potuto effettuare l'upload si Github.
Quindi mi basta ogni volta che scrivo un nuovo articolo su Ghost in locale, effettuare la "compilazione" di Ghost ed effettuare il git push sulla mia repository.

Modifiche online in tempo record.

Come ho scritto qualche riga sopra, voglio caricare su questo mio portfolio solo i progetti che reputo più interessanti, volti a studiare un linguaggio piuttosto che per approfondire uno strumento che già conoscevo.

Ecco i tre progetti che ho scelto di caricare per la messa online del sito. Ce ne saranno sicuramente molti altri, spero, ma questi sono quelli che reputo più interessanti. Se ne avete voglia potete consultarli.

🔗 Tinson 🤖 - Un title manager per Tinfoil fatto con Node e ❤️
🔗 Pokemon Quest Wiki App: La mia prima app in Cordova 👾
🔗 Snake in JavaScript 🐍

Crediti e strumenti utilizzati

🔗 https://www.npmjs.com/package/ghost-static-site-generator
🔗 https://ghost.org
🔗 https://en.wikipedia.org/wiki/Headless_content_management_system