Flagg

il blog di un diversamente sano di mente

Flagg

Categoria: Tech (Page 1 of 5)

La puntualità tedesca

Oggi a Berlino mi stupisco piacevolmente della precisione tedesca. 

Per fare un esempio:

  • Richiedo tessera per i mezzi pubblici online, invio i miei dati bancari.
  • Dopo una settimana mi perviene per posta ordinaria una lettera di conferma, che mi annuncia la consegna della carta intorno al 20 del mese.
  • il 24 ancora la carta non si vede, mi preoccupo. Il 25 mi arriva la carta a casa e ancora nessun addebito bancario.
  • Il primo del mese successivo la carta e´attiva ed esattamente lo stesso giorno mi perviene l’addebito.
  • Lo stesso giorno il tram che uso abitualmente per il tragitto casa-lavoro percorre una strada diversa, per due mesi seguiva una strada alternativa per alcuni lavori stradali.

Qui le attività seguono veramente il calendario: un qualcosa finisce a fine mese, un qualcosa inizia il mese successivo.

Mentre termino di debuggare una nuova funzionalità per il sito della startup per cui lavoro, certo di astrarre problemi umano-tecnici e di poterne applicare un insegnamento per la vita di tutti i giorni:

  • Non e´sempre la cosa più giusta quella che funziona
  • La stessa cosa che oggi funziona domani potrebbe dare problemi in un altro contesto
  • Correre troppo ti fa perdere di vista la strada che stai percorrendo per la prima volta, ma anche le strade che hai percorso molte volte in passato
  • Devi stare attento alle impronte che lasciano gli altri sul loro cammino
  • Meglio concentrarsi su una cosa alla volta.
  • Non ripetere passaggi inutili più´volte e togli di mezzo ogni singola distrazione, se vuoi concentrarti pensa ad una stanza bianca senza oggetti e poi aggiungi solo quelli che ti servono.

PS ho appena terminato di vedere le prime tre stagioni di Rick and Morty, penso sia una delle serie piu’ belle degli ultimi tempi

Varie ed eventuali di Luglio 2018

Librerie e framework per JS

Sicumera Informatica

Grafica e immagini

Scala (una new entry)

 

Wikipedia Backup (it,en)

A causa delle recenti proposte di Legge Europee, Wikipedia sta scioperando in questi giorni. Qualsiasi ricerca viene rediretta a questa pagina.

Per fortuna le api funzionano normalmente…

Wikipedia Backup

 

CSS Specifity Wars

Ovvero, quale regola di stile vince? Una semplice immagine svela l’arcano.

Notare come .foo .foo #foo > .foo #foo > #foo

L’articolo originale

Aggiungo:

 

Imparare i CSS rapidamente

Tre pagine web per imparare ad utilizzare i selettori, il grid ed il flex system

 

 

Razor is fun…ny

Microsoft Asp.Net Razor is a sort of “PHP” markup language for Microsoft Web Pages(Views, Partial Views etc etc).  For sure better than Asp Classic or Aspx

BUT

As the special language char is @ does not require explicit closing of the code-block you can find very tricky situation (escaping CSS with a double @@ is the easiest one)

For example inside a loop, with a custom template when you need the correct relative url path given by the server (using the “~” operator) you have to write something like this:

@(Html.DevExtreme().SelectBox()
.DataSource(LanguageItems)
.DisplayExpr(“Description”)
.ItemTemplate(@<text>
<div class=”custom-item iconNav”>
<img class=”lang-image” src=’~/Content/icons/@(“”)<%= ImageSrc %>’) />
<div class=”lang-description”><%= Description %></div>
</div></text>)
)

Where in particular:
<img class=”lang-image” src=’~/Content/icons/@(“”)<%= ImageSrc %>’) />

The <%= ImageSrc %> is related to a property inside a given loop of items (Object.ImageSrc)

The <%= %> is the aspx syntax required also in this case.

The joined @(“”) is totally an empty dummy string that call the Razor engine in order to manage the string as a dynamic one. Otherwise the final src would become

<img class=”lang-image” src=”/Content/icons/&lt;%= ImageSrc %&gt;” )=””>

instead of the correct one:

<img class=”lang-image” src=”/Content/icons/ita.svg” )=””>

I certificati iniziano a farsi sentire (farewell old SSL, welcome TLS1.2)

“HttpRequestException” insieme ad un “User or password error” … mi ha risposto l’autenticazione del client GitHub per SourceTree (da Windows). E la cosa era imbarazzante perchè avevo appena cambiato password. Però poi mi è venuto in mente che negli ultimi mesi il protocollo SSL di vecchia generazione verrà mandato finalmente in pensione e tutti i servizi web lo dismetteranno.

Quindi per SourceTree in Windows al fine di non avere quel messaggio inutile di cui sopra occorre:

Notare che su Chrome invece i siti con certificati non più sicuri verranno bloccati dalla versione M66 (disponibili dal 15 Marzo per gli sviluppatori)

Link

https://developercommunity.visualstudio.com/content/problem/201457/unable-to-connect-to-github-due-to-tls-12-only-cha.html

https://community.atlassian.com/t5/Sourcetree-questions/How-do-I-setup-Sourcetree-to-access-Github-now-that-they/qaq-p/735377

https://github.com/Microsoft/Git-Credential-Manager-for-Windows/releases/tag/v1.14.0

Here comes React (React-Sorrt)

Orbene, spinto dall’onda avanguardistica ho provato ad effettuare il porting di Sorrt in React… ed è stato tutto quanto indolore. Anzi, i pro sono molti.

Avevo il dubbio che una “build” di React potesse essere un po’ pesante, almeno in termini di spazio fisico occupato dai file ed invece il pacchetto finale occupa 600KB totali (occhio perchè a runtime React ottimizza il caricamento degli script a seconda delle necessità).

L’ambiente di debug è abbastanza pratico, il “compilatore” segnala errori in tempo reale ed il banale non dover fare shift-refresh ad ogni modifica fa risparmiare TANTO tempo.

Nel complesso al momento posso confermare che tutti questi truschini, ovvero web framework o librerie (ReactJs, Angular, Vue etc etc) applicano delle regole in moda ordinare e strutturare al meglio lo sviluppo di una webapp…

React-Sorrt

Salutame a’ sorrt

Quando avete una lista di numeri a occhio è facile ordinarli e sapere quale sia il piu’  grande oppure il piu’ piccolo nella sequenza.

Lista

  • 3
  • 43
  • 65
  • 75
  • 422

Tutto ciò è banale, 422 e 3 spiccano tra i 5 elementi. Ma se ogni singola occorrenza contenesse numeri piccoli e di lunghezza discreta?

Lista

  • 0.25984589485472
  • 0.24582681284584
  • 0.24852486248545
  • 0.26475684556884
  • 0.26486552785562

Quanto ci mettete ad ordinarli? Se fossero 100? Cosa potete utilizzare? Magari Excel ed attivare un ordinamento.

Beh io sono piu’ pigro ed Excel non lo voglio utilizzare.

 

Here comes a new idea: Sorrt (codice su Bitbucket , esempio su JsFiddle )

Il form permette:

  • l’inserimento solo di numeri
  • premendo Sort la lista viene ordinata e salvata (local storage del browser). Quindi se si riapre la pagina contenente lo script viene mostrata l’ultima lista salvata precedentemente.
  • si può ordinare a proprio piacere col drag & drop di una riga
  • cliccando su una riga l’elemento viene cancellato

Update ho fatto una piccola aggiunta, adesso si può passare in querystring direttamente una lista di valore (?values=1,2,34,56…)

Resize Image on client side (Shrink Photo)

Scenario: your (web) application has to shrink an image before sending it to the server, in order to limit bandwidth and server storage
Many suggestion and js library could be found, the best in my perspective is Image Load (it adds feature like Exif inspection, Jcrop support and scale, rotation).
Everything was working like a charm, on the paper, on my mind… but then
  • Edge was not sending the resized image
  • Safari on iPad and iPhone was sending rotated images
  • Firefox was not sending the image at all

Every point of the above list was caused by something very annoying in the front-end development word. Sort of half-compliance to standard API.

For example:

  1. Edge supports the Javascript API File, but the File object (native method) and the Blob object differ from the standard W3C implementation (problems with the name for example and in some case you have to use msSaveBlob instead of the Blob method that you can find in Chrome/Firefox). So you have to “cast” the Blob to a File, or adding for example the name of the file to the server in another way (form hidden field etc etc)
  2. IE/Edge form object (useful FormData() ) doesn’t support delete method, so you can copy all the elements of an existing form but you cannot remove them
  3. Safari saves camera rotated images (it is an exif property) but you cannot see this until you don’t send the image to the server
  4. Firefox skip preventdefault event in random case (?!?)

So, the File Management Browser implementation is “almost” safe, “almost” sound but needs a bit of customization for each vendor.

 

PS as the original idea was related to uploading selfie like or avatar photo I’m saving on server side all the images in JPG format, as there is no camera mobile or not that save in PNG format… I want to highlight this as all the example I found manage only Canvas -> Png export/save  (even the Load Image Test page saves the output to Png renamed to Jpeg)

Other sources and credits

Page 1 of 5

Powered by WordPress & Theme by Anders Norén

Utilizzando il sito, accetti l'utilizzo dei cookie da parte nostra. maggiori informazioni

Questo sito utilizza i cookie per fornire la migliore esperienza di navigazione possibile. Continuando a utilizzare questo sito senza modificare le impostazioni dei cookie o cliccando su "Accetta" permetti il loro utilizzo.

Chiudi