Press "Enter" to skip to content

GOTO 2016 • Elm-Friendly Functional Programming For The Web • Luke Westby


Ciao a tutti
Sono Luke Sono venuto qui da Chicago
per parlarti del mio preferito
linguaggio di programmazione Elm così Elm è
programmazione funzionale amichevole per il
web che è il nome di questo è il
nome di questa sessione e puoi vedere
che sul sito Elm Elm – Lang org
si costruisce da solo come delizioso
linguaggio per costruire applicazioni web affidabili
quindi è funzionale ma è così
un po ‘come quello non è davvero il
una parte importante è la parte importante
che è possibile è possibile utilizzare per costruire Elm
davvero davvero belle esperienze oh davvero
va meglio, va tutto bene
per davvero questa volta
sì, quindi puoi usare Elm per costruire davvero
esperienze piacevoli per gli utenti
web stava sviluppando abbiamo avuto questo
progressione della tecnologia in cui le persone
stavano arrivando con modi in modo che tu
potrebbe costruire cose interessanti e ora siamo dentro
un posto dove capiamo come
per costruire cose interessanti e l’idea è come
costruiamo tecnologie che rendono
le persone veramente brave a costruire cool
roba e così Elm è davvero carino
la soluzione a questo problema è davvero
soluzione ponderata per rendere le persone
davvero capace di costruire davvero bene
cose anche come principianti, quindi oggi mi piace
di voler capire quanti di voi
solo da una dimostrazione di mani hai usato Elm
prima in qualsiasi capacità oh wow, questo è un
abbastanza buono okay e quindi quanti
la gente forse non ha usato l’allume ma tu
sapere di aver sentito di cosa si tratta e
ti interessa, okay, questo è un
molto più quindi l’ idea che voglio al
idee che voglio passare
oggi va bene così per avere gente che lo è
tipo interessato dall’essere interessato
per aver effettivamente visto qualcuno costruire un
piccola cosa con l’olmo e la comprensione
com’è l’esperienza e così sono
intenzione di farlo semplicemente scrivendo un po ‘
quindi ho un terminale qui sto andando
rubare una tecnica da Jose Jose che
Ho visto ieri tutto a posto e poi io
penso che sia abbastanza grande quindi vediamo
la prima cosa che devi fare quando tu
quando imposti qualsiasi tipo di tecnologia
proprio come installarlo e ottenere il tuo
progetto istituito così ho la maggior parte di voi
ha funzionato con uno strumento come web pack o o
gulp o conosci una lunga lista di
quelle cose sì
qualcuno direbbe che è come un super
esperienza facile per creare un front-end
costruisci una catena in modo da stare seduto su Elm
questo e forse lo troverai a
molto più bello quindi una delle cose che puoi
fare è fare clic su Inizia nella home page
e vedrai qui ci sono gli installatori
per Mac o Windows e penso di più
modo conveniente per farlo è se lo hai
hai già ottenuto NPM puoi installare NPM –
JEE elm e non ho intenzione di eseguire questo
perché siamo a una conferenza e io
non fidarti del Wi-Fi quindi una volta che hai
fatto che finirà con pochi
cose nel tuo terminale quindi abbiamo L
fai quale è il compilatore LM è a
linguaggio statico compilato abbiamo elm
pacchetto che è il gestore pacchetti LM
repple che è il repple e l’olmo
reattore che è un debug reattivo
l’ambiente olmo è tutto veramente
nomi descrittivi per le cose invece di
tipo di nomi di marketing di fantasia quindi se tu
voglio installare un pacchetto senza di me usare
Il pacchetto di Elm è solo un po ‘come le cose
vai se vuoi fare HTTP usa Elm HTTP
così stiamo andando a realizzare un progetto che cosa
devi fare per impostare un progetto conosciuto
viene eseguito il pacchetto di installazione di LM inserire il pacchetto
il manager ti chiederà se va bene
se installiamo una coppia
librerie quindi abbiamo il core e abbiamo
HTML che dipende Dom virtuale in modo
core è l’insieme delle librerie di base
conoscere l’ elenco delle diverse strutture di dati matematiche
funziona tutte le cose del genere
dovresti avere in giro
per essere produttivo con un olmo
programma elm e quindi HTML è come siamo
andando a prendere le nostre cose e mostrarle
l’utente quindi arriveremo a questo verso
la fine bene dice al gestore di pacchetti
che va bene installare queste cose così
ora abbiamo un sacco di dipendenze io
vorrei davvero che siamo più grandi, ok è così
non permettendomi di zoomare, farò solo LS
è bello quindi abbiamo questo album
pacchetto che JSON ci dice alcuni
cose sul nostro progetto abbiamo ottenuto un
versione e solo alcune informazioni se noi
stavano per costruire una terza parte
pacchetto e poi diremo a elm dove
trova i nostri file di progetto è carino
convenzionale per inserirlo nella fonte così
faremo una directory sorgente e poi
questo è davvero importante questi
specifiche di dipendenza quindi Elms
il gestore di pacchetti ha una semantica rigorosa
requisiti di versioning e il modo in cui è
in grado di farlo è dato che l’ elm è
tipizzato staticamente il compilatore può essere eseguito
mentre il gestore pacchetti funziona
capire ok hai pubblicato
conosci la versione 4 di elm Lang slash
core e hai fatto un cambiamento che hai
cambiato il tipo di qualche funzione che hai
cambiato il tipo di add a non più
accetta float ma ora accetta numeri interi
che spezzerebbe il codice di tutti e
così quando vai a pubblicare questo e te
prova a dire bene che conosci gli interi e
i float sono ancora numeri quindi forse è così
proprio come un tipo dietro le quinte di
cosa e tu ti imbatti nella patch
versione che dici è ora 4.0.1
il compilatore entrerà in esso
andando a capire in realtà questo è un
rompere il cambiamento e quindi non lo sei
permesso di pubblicare questo a meno che tu
cambia la versione della semantica maggiore
la versione a 5 in modo che nessuno è permesso di
pubblicare i cambiamenti di rottura sotto non maggiore
versioni mantiene tutto molto bello
per le persone che usano i pacchetti così
hai creato un progetto elm e
non hai alcun timore che l’aggiornamento
il tuo
le tendenze causeranno il tipo
discrepanze non ti protegge
da bug ma ti protegge
dagli errori nei tipi e nelle cose
così, aggiungiamo solo rapidamente
Ricapitoliamo di aver eseguito l’installazione del pacchetto
lo abbiamo modificato per indicare una fonte e
abbiamo creato quella directory e il
l’ultima cosa che dovremo fare è creare un
index.html quindi abbiamo la fonte
index.html e poi le nostre cose Elam e
quindi il mio foglio di argomenti, quindi lo farò
basta riempire questo
quindi ne indicheremo alcuni in alcuni
file chiamiamolo Thane e poi possiamo
vai avanti e non creare file in modo simile
tre passi abbiamo impostato tutto questo
dobbiamo eseguire un elemento di base e
è abbastanza bello, quindi in realtà
scrivi qualcuno, ecco perché siamo qui
quindi quando Soros abbiamo questo non può Elm
file vuol dire uno standard piuttosto carino
nome per un file home di un punto di ingresso
e tutti i m-files devono avere un modulo così
questo file chiamato significa quindi dobbiamo chiamare
significa che avevamo un modulo chiamato sorgente
taglia qualsiasi cosa tagliata che dovremmo avere
chiamalo quel qualsiasi modulo dot dot
i nomi devono mappare sulla directory
che sono dentro con il file corretto
nome quindi se questo non può Elm il
il nome del modulo deve essere principale e poi esso
ci aiuta a mantenere i nostri nomi dei moduli gentili
di unico ed evitare scontri di nome e
diremo cosa espone quindi andrà
solo essere tutto proprio ora punto punto
significa tutto
quindi Elm è davvero adorabile, è davvero facile
imparare quando si scava in esso perché
ci sono davvero pochi concetti che tu
bisogno di capire quindi ci sono
alcuni dati contengono numeri interi
galleggiano le corde di tutto il booleano
tipi primitivi e poi ci sono dati
strutture e combinazioni di quelli
digita tutti i dati ha un tipo quindi è necessario
di ‘quali sono i nostri dati e qual è la sua forma
è e quindi creiamo relazioni con
con i dati che utilizzano le funzioni quindi è giusto
dati e funzioni è tutto ciò di cui abbiamo bisogno
capisco davvero di capire Elm e
quindi a volte i dati hanno uno speciale
significato per il runtime di messaggistica unificata e it
dice di fare cose come render o o
fare richieste HTTP ma è ancora tutto solo
dati così non lo sei in realtà
mai causando una richiesta HTTP per accadere
stai solo descrivendo ciò che sei
richiesta dovrebbe essere simile e poi a tutti
succederà dopo un po ‘fuori dal tuo
controllo e questo ha qualcosa di veramente bello
effetti che ci consente di pensare solo in
termini di ciò che è lo stato del mondo
in termini di dati in termini di un modello e
ci consente di descrivere tutti i cambiamenti
nel nostro sistema usando solo le sole funzioni
funzioni apolidi quindi non ci sono
piccole isole di stato in tutto il mondo
il luogo che interagisce tra loro
ed essendo sovrascritto abbiamo sempre e solo
ha uno stato e noi siamo sempre e solo
permesso di fare aggiornamenti immutabili a questo
stato con una funzione
quindi diamo un’occhiata qui, quindi facciamolo
iniziamo con un po ‘di valore e
diremo che alcuni valori sono int e alcuni
il valore è uguale a 42 e posso compilare
questo con l’umile dico solo che lo farò
questo non significa che non barra fonte olmo
lo dirà all’output per costruire la barra
significa j / s e si compila correttamente
il codice generato per l’allume è è
dall’aspetto interessante è abbastanza
grande è un sacco di codice continua per a
mentre l’ idea è che l’ olmo non ha
errori di runtime non ha un concetto
di errori di runtime e ho intenzione di essere
andando progressivamente su ciò che sono alcuni
delle caratteristiche del linguaggio che
renderlo possibile
quindi non hai davvero bisogno di piacere
attaccare un breakpoint su qualsiasi riga di questo
di questo codice dall’aspetto interessante è bello
la proprietà di questo codice è comunque quella
dal momento che tutto è in cima
livello e appena concatenato con il dollaro
segnala che è molto sensibile al minuto
minificazione in modo da poter finire con a
veramente piccolo sai 40 kilobyte dopo
gzip per un file davvero complicato
applicazione va bene quindi ne abbiamo alcuni
valore scriverò una funzione aggiungi quindi aggiungi
prenderà un int e un int e
produrrà un nuovo int e noi
definire il corpo della funzione in questo modo
così abbiamo lasciato come primo argomento noi
scrivi come il secondo e noi stiamo solo andando
fare due argomenti quindi diremo uguale
e poi a sinistra + a destra, quindi per le persone
provenienti da come JavaScript o Java
lo sfondo principalmente questo è come un
modo strano di guardare una funzione perché
non ci sono parentesi e non c’è
virgola e c’è una strana casualità
freccia tra queste due estremità qui
potrebbe avere senso se guardasse di più
come questo ma lo facciamo così perché
sai tutte le tue funzioni tipo
applica progressivamente applica gli argomenti quindi io
non devo solo
tutti aggiungono con due numeri che non devo
chiamarlo così necessariamente potrei
Dì che voglio che tu sappia un premade
funzione aggiungere dieci e voglio che solo
prendere una sintonia aggiungerne 10
produrre un altro int e io posso sfidare a
aggiungi 10 in termini di add, lo passo e basta
uno così quando stai leggendo la funzione
firme sai che vai da
da sinistra a destra e tu dici bene aggiungi take
un int va bene e poi dopo questa freccia noi
avere altre due cose così dopo averle prese
un int mi restituisce una funzione
questo prenderà un’altra fine che
allora mi darò il mio risultato finale e
questo è vero per tutte le funzioni di Elm
se voglio dire che i nostri risultati sono int
produrrà il risultato e dirà che siamo
andando ad aggiungere qualche valore a se stesso
ah-ha l’ ho scritto male così ora
stiamo tutti bene possiamo compilare questo o noi
posso gestirlo nella pace che potrei dire
importare significa esporre tutto te
posso guardare ad un valore solo 42 e posso farlo
guarda il risultato che è 84 eccellente
quindi di cosa parliamo di a
scenario quindi dopo questo discorso che è
super bene, siete stati tutti convinti
che stai per usare l’ olmo e tu lo hai fatto
andato via e tu hai costruito come un enorme
progetto con esso al tuo super successo
startup e ora ne hai molte
team e stiamo andando dire che si sa
la squadra B è finita qui loro sono
responsabile dell’attuazione di
aggiungi e i risultati e la funzionalità a team a è attiva
qui e sono responsabili per alcuni
valore quindi il project manager il prodotto
manager per il futuro team a arriva via e
dicono che ascoltate è davvero
importante per i nostri clienti che questo sia
qualche valore B implementare
come una stringa invece di un pollice per alcuni
motivo per cui possiamo entrare e possiamo fare
questo cambiamento ora è problematico
Certo che se questo non fosse questo non era Elam
potremmo essere in grado di fare questo noi
potrebbe essere in grado di prendere qualche valore per passarlo
in aggiungere e finire con qualcosa
super strano come questo flusso per due per
due o forse c’è un casting strano
andando da qualche parte in ogni caso l’utente
è attualmente in attesa di vedere 84 come il
valore dei risultati come vediamo
qui e loro non lo otterranno
se funziona, ma siamo fortunati perché
stiamo usando Elam e quando ci provo
compili questo il compilatore ne ha alcuni
parole per noi ci venderà il
il primo argomento per la funzione add è
causando una mancata corrispondenza di tipo è sbagliato come
aspettando che i primi argomenti siano un int
ma in realtà è una stringa che non conosco
se tutti voi avete usato le lingue compilate
prima ma questo è il più sorprendente
messaggio del compilatore che abbia mai visto
tutta la mia vita è esattamente dove il
il problema è e cosa abbiamo sbagliato e così via
abbiamo commesso un errore , siamo in due
squadre completamente separate ce ne sono molte
codice in questa base di codice ma prima che abbiamo
anche prima di correre in CI prima di noi
eseguire qualsiasi test prima che ci sia arrivato
produzione prima che gli utenti abbiano iniziato
inviare i biglietti prima di averlo fatto
qualsiasi cosa prima abbiamo persino visto alcun codice
corri sappiamo già che c’è un
problema con il nostro programma e quindi possiamo
torna al gestore del prodotto e
Diciamo che non possiamo davvero fare ciò che avremo
a venire con un modo diverso che siamo
andando a essere in ritardo su questo termine forse
e quindi lo cambieremo nuovamente in un
int e quando lo costruiamo tutto è
ok ora se sei come me , in qualche modo
a volte si sentono frustrati con il processo
e forse ti piace solo averlo
fatto e vedere come va
quindi se fossi in me sarei subdolo, ci provo e
come se togliessi questi tipi, sto solo andando
per portare via i tipi e sto andando a
prova a mettere uno dopo il compilatore
è praticamente lo stesso messaggio quindi io
tolto tutte le annotazioni di tipo e
ci viene ancora detto di aggiungerne uno
numeri e ti stai dando una stringa così
questo è davvero fantastico
Sistema album tipo è che è approfondita è
è un sistema tipo hindley-milner per
per le persone che sono interessati a nel
l’informatica di ciò significa che lo sa
quale dovrebbe essere il tipo di annuncio
perché sa quale sia il tipo di
più l’operatore è l’operatore più
di per sé è solo una funzione trovata in questo modo
piuttosto è un numero è una specie di a
generico quindi il compilatore sa già
quale plus è definito come e abbiamo
definito aggiungere interamente in termini di più così
sa che cosa dovrebbe essere Add e
sa quale valore ha perché è
definito come letterale, quindi il compilatore è
in grado di tenerci sotto controllo anche se noi
non avere voglia di riempire quel tipo
annotazioni per tutto il tempo, così abbiamo salvato
noi stessi molto debugging finora
abbiamo coperto come base di base
i dati che conosci 42 sono forse interessanti
ma non è abbastanza interessante, quindi cosa?
stiamo per fare è un modello reale
dati così come ho detto in Elm che abbiamo
tipi primitivi abbiamo anche modi di
combinandoli in strutture dati così
il modo in cui facciamo i dati strutturati
quasi con i record quindi se voglio fare il gentile
di definire me stesso diciamo che il mio nome è
Luca ho un nome che è una stringa e
Ho un’età che è un int e se io
voglio riempire questo in questo è un record
scrivi quindi con i campi del nome
tipi particolari solo in parentesi graffe
e due punti per ogni campo e se io
voglio creare un’istanza di questo se io
vuoi creare un valore con questo tipo
Per prima cosa correggerò il rientro
vieni qui andiamo
quindi il mio nome è Luca Ho un età e
allora forse voglio piacere il mio modello
fidanzata – così anche la morte ha un nome e
anche lei ha un’età
okay e allora scriviamo a
funziona su questo perché LM è tutto
dati e funzioni in modo da ottenere come um
conosci le informazioni sulla persona
ci vorrà una persona con una stringa di nome
e un’età che è un int e sarà
produrre un messaggio stringa okay lo faremo
di ‘una persona chiamata piccola stringa di penny
è la stringa guarda la versione della stringa
della loro età e dirà anni
periodo in modo che ora abbiamo una funzione su
questi tipi di dati Ora se salto indietro nel
alla pace vediamo che possiamo chiamarci
può importare prima significa ancora e poi se
noi chiamiamo informazioni persona mi ha lasciato ti dico
come sono il mio nome e quanti anni ho
chiamalo su Beth e avrai lo stesso
informazioni quindi è fantastico
questo ci tiene sotto controllo se succede
ad errori ortografici un parametro qui cerco di
valuta di nuovo ciò che sta per dire
noi questo è un messaggio di errore davvero interessante
e in realtà voglio eseguirlo con il
compilatore perché è meglio con il colore
guarda questo è fantastico così è
dicendo l’annotazione del tipo per persona
l’informazione è sbagliata o è in disaccordo
con ciò che gli hai dato è
Dicendo che passi in qualche disco con un
nome campo ma quello che hai effettivamente provato
passare quando hai chiamato era
qualcosa con il nome senza e al
fine è così intelligente che è fatto 11:15
confronto a distanza tra ciò che voi
dato e ciò che ha effettivamente ottenuto e
in realtà ho capito che in realtà tu
potrebbe aver appena scritto male questa cosa
e questo è assolutamente il caso, quindi se riparo
Questo
tutto torna alla normalità, quindi noi
potrebbe vedere molto questo messaggio di errore
perché sono cattivo nell’ortografia, ma è così
totalmente come una demo del fantastico
i messaggi del compilatore sono totalmente accesi
scopo okay sicuro
sarà meno diretto quindi se mi piace
naturalmente la parola chiave un po ‘così è
non ti dirò che vuole
qualcosa con il nome ma tu in realtà
dato qualcosa di diverso ma non lo è
andando a fare questo confronto a distanza
non sa davvero che è quello che tu
significava, ma è ancora bello
chiudi ancora raccontandoti cosa ti sei perso
e quello che avevi bene così bene così
Finora abbiamo eliminato un po ‘
digitiamo errori che abbiamo eliminato a
questi errori mancano del metodo
cose che non si sta andando ad avere per
trattare con se si costruisce un progetto con
elm soprattutto errori di ortografia che
è probabilmente come il singolo più comune
la fonte di indefinito non è una funzione in
JavaScript così puoi prepararlo
come se non lo vedessi mai più
usi casa così questo sarà questo codice
non è perfetto anche se è um
è soggetto al tipo di refactoring
problemi è Pro ne ha molti
duplicazione quindi se volevo dire bene
in realtà la mia età è a galla perché ho 25 anni
e mezzo è che sarà ancora compilato
ok perché abbiamo effettivamente chiamato
informazioni personali, ma se apro il repple e
Provo a chiamare informazioni personali con me stesso
avremo un problema perché
vuole un int è in realtà un float ma
le cose funzionano ancora con Beth così
abbiamo un problema di refactoring che ho
problema di duplicazione del codice a meno che non si ottenga
intorno a questo permettendoci di assegnarti
conoscere il nome qualificato
per i nostri tipi complicati, quindi posso
fai questo tipo di persona
alias piuttosto persona non significa solo
ring age che è un float che posso sostituire
Questo
e ora quando lo chiamo va tutto bene
e posso tornare indietro e posso refactoring
questo per essere un int e mi aiutano
errori di coniazione e mi aiutano
errori del compilatore di nuovo mi dicono di andare
attraverso e correggere i miei dati prima ancora di me
preoccuparsi di gestire la mia funzione così è
dicendo che ci hai dichiarato come a
persona questo tipo unificato di fonte di
informazioni sulla forma di questi
cose ma l’hai assegnato per essere un galleggiante
quindi devi andare e sistemarlo così quando io
farlo
va tutto bene di nuovo
eccellente fammi vedere dove stiamo bene
quindi ora facciamo qualcosa un po ‘
più complicato è un best seller
Chicago quindi ci lascerà per ora
Facciamo in modo che facciamo questo
modello di dati forse un po ‘di più
specifico per due conferenze diciamo così
le persone qui hanno nomi che siamo
non interessato all’età delle persone a
conferenze ma forse siamo interessati
come il loro ruolo al
tipo di conferenza di quello che stiamo facendo qui
cosa c’è scritto sul nostro badge che io
ho dimenticato nella mia stanza che lo terrà
su così diciamo come ruolo al conf
rendere questa stringa al posto di questo faremo
dire bene a tosse è parlare qui, ma
forse abbiamo anche come partecipante o equipaggio
cose del genere e quindi sono un oratore così
Lo farò per informazioni sulla persona dirà
è un e poi farà a ciò che è già
una stringa in modo che possiamo fare il ruolo dei personaggi a persona
Kampf dirà al passaggio a pH C ok
Salva questo va bene così sto andando speaker esso
vai a C pH Sono abbastanza buono ma come me
detto che non sono molto bravo a ortografia in modo
è più probabile che stavo facendo un
applicazione di produzione che vorrei fare
qualcosa del genere lascerò la R
o qualcosa del genere e così quando questo diventa
chiamato alla fine nella nostra bella interfaccia utente
gli utenti saranno piuttosto arrabbiati con
noi perché sai che questo è davvero
bella conferenza e anche se l’ho fatto
il meglio che potevo
Sono completamente imbarazzato da tutti
spelling the word speaker wrong the
problema è questo è un codice totalmente valido
questo è completamente valido , abbiamo detto
quel ruolo in conf è una stringa ed è
come se fosse una stringa totalmente valida
fatto nulla di sbagliato per quanto riguarda il
compilatore è interessato Sono solo male
Inglese
quindi quello che devo fare è assicurarmi che io
non ho l’opportunità di farlo
errore quindi siamo assolutamente sicuri che lì
sono tre opzioni per il nostro ruolo in
Coffield abbiamo detto che ci sarebbe stato
speaker e partecipante ed equipaggio quindi Elm
affrontiamo questo definendo
i nostri propri tipi di dati con valori personalizzati così
Posso solo firmare questo tipo totalmente nuovo I
Dì solo il tipo di ruolo che dico sia a
chi parla guarda cosa intendo con l’ortografia
um relatore o partecipante o equipaggio quindi ora se
Voglio farlo posso solo assegnarlo
valore questo è ora una cosa di prima classe
è solo un valore normale come qualsiasi
altro posso passarlo dove voglio se io
voglio fare informazioni sulla persona di cui ho bisogno
per modellare la partita, quindi farò la persona del caso
dot roll it keV di due la prima opzione
è oratore che possono dire che non c’è un nome
solo parlando possiamo ottenere un po ‘
più specifici che vanno a sbarazzarsi di CPH
questa altra roba così anche noi possiamo essere un
il partecipante che il nome sta frequentando va a UC
pH potremmo dire che il nome del punto della persona dell’equipaggio è
un membro dell’equipaggio H di due go ed è
arrabbiato con me perché non sono cambiato
questo così oltre a usare il valore
quaggiù dobbiamo anche dichiararlo
il tipo dice che ora è un ruolo
opposto a un aspetto di informazioni di stringa persona
bene, quindi se dico informazioni sulla persona di Luca ora
è come sto parlando
ma se cambio il mio ruolo per essere un 10 così
dopo questo sarò solo un partecipante
può cambiare che saranno presenti e
questo non è il caso, ma se cambio
questo a Cru avrebbe stampato l’equipaggio
messaggio e se ho sbagliato a scrivere ora e io
prova a compilarlo lo farà
lo stesso tipo di informazioni utili è
andando a dire che non so di cosa si tratta
ma ho trovato qualcosa di abbastanza vicino così
forse è questo che intendevi di nuovo così
abbiamo completamente tagliato fuori come strano
casi limite e errori di ortografia anche
per cose in cui potresti avere una stringa
in altre lingue per denotare innumerevoli
opzioni quindi siamo solo che stiamo lentamente
abbattere le opportunità per vie
perché il tuo programma si arresti in modo anomalo, quindi cambio
questo indietro tutto si compilerà giusto
bene okay un’altra cosa bella dell’utilizzo
questo tipo di tipi è questo se lo sei
come me sei impaziente che vuoi ottenere
piace direttamente al fantastico visuale
parte di costruire quell’interfaccia utente quindi forse solo io
voglio trattare con gli oratori in questo momento
questo è il tipo di pezzo simile dell’interfaccia utente
che voglio costruire così sto per farlo
riempi la parte dell’altoparlante e poi forse
Ci tornerò più tardi se ricordo
e riempire il resto, ma ci provo
compilare questo il compilatore sta per
avere qualcosa da dire in proposito che si tratta di
dirai che hai fatto questo caso
dichiara il tuo pattern corrispondente al ruolo
al conf ma ti mancano due valori così
c’è un’opportunità totalmente qui per
se questo codice fosse teoricamente
esegui affinché tu passi qualcosa in e
non avere il codice che si occupa di te così tu
potrebbe restituire un indefinito ma non lo facciamo
non definire un olmo così prima ancora di averlo permesso
si esegue questo codice si sta andando ad avere
per finire di scrivere la funzione in modo che
essere un luogo dove si può conoscere o
errore di riferimento non definito si insinua in e
semplicemente non possiamo averlo, quindi c’è
c’è un altro modo di trattare
con null in elm
si chiama forse forse è trovare come
questo quindi tipo forse un tipo così asso
parametro che significa che forse è come un
contenitore per una cosa è qualsiasi tipo così
puoi avere una forse forse una stringa
forse la persona forse è solo la
cosa o non è niente
questo è incredibilmente elegante, così è
lo stesso tipo di tipo personalizzato di quassù
non c’è niente di speciale nella lingua
che definisce forse è solo una specie di
intorno definito esattamente come questo e così
ha tutti i tipi di proprietà sorprendenti che cosa
ti costringe a fare è affrontare
vuoto prima di affrontare il valore così
dove null è un tipo di interfoliazione
con l’idea dell’esistenza, così puoi
avere alcune variabili in Java o JavaScript
e può può essere può essere un te
conoscere una persona o può essere nullo e
non c’è niente nel nome del
variabile o qualsiasi proprietà di quello
variabile che ti dice quale è
sarà in olmo poiché il vuoto è
rappresentato al di fuori del valore si deve
affrontalo prima
quindi, proprio come lo schema utilizzato per il ruolo
non possiamo dover modellare una corrispondenza
forse per ottenere il valore
dentro quindi diciamo che c’è uno lo sai
stiamo andando a rappresentare la persona
sul palco quindi a volte c’è un
una persona qui e qualche volta non lo sono
non c’è un caso in cui siamo lì
forse ci sarebbe qualcuno qui, quindi lo faremo
avere una persona sul palco e questo è un
forse persona
e così se noi non abbiamo nessuno su
qui diremo semplicemente che nulla è sul
fase di non riferirsi alle persone come cose
è un po ‘strano ma se
qualcuno è qui, quindi sono qui, giusto
adesso
potremmo dire solo Luca e così ora se noi
voglio fare una persona informazioni che possiamo refactoring
questo codice un po ‘per accettare un forse
la persona rinominerà questo per essere più chiaro
ora modelliamo la partita su forse una persona
è un caso forse persona di solo persona
allora tratteremo le loro informazioni
altrimenti nulla potremmo dire che nessuno lo è
sul palco
Fanni faccia bene chiameranno questo
persona sulle informazioni sul palco se guardi dentro
la pace che possiamo importare possiamo fare a
persona sul palco informazioni una persona sul palco
quindi ora sono qui su di te
altrimenti, se questo è vuoto, lo dirà
noi che nessuno è sul palco e lo farà
essere molto triste e così come prima
quando ho lasciato alcune parti di questo schema
parte di dichiarazione corrispondente di questo caso
dichiarazione se vogliamo essere pigri come me
fai sempre e lascia fuori questa parte e
diventa semplice per costruire il
interessante interfaccia utente appariscente per il caso in cui
c’è qualcuno lì che i compilatori non vanno
lasciarci
è un po ‘per quelli, ma diventa
allo stesso tipo di punto che sta dicendo Oh
parte di me non ne abbiamo bisogno perché
è costruito bene, quindi sta dicendo um
il tuo caso qui su forse la persona che copri
la gioia ma devi anche coprire
Niente altrimenti saremo in
lo stesso tipo di situazione che abbiamo con
null e null non sono consentiti in elm
perché i programmi non sono autorizzati a crash
uno gnomo quindi è necessario trattare con esso
anche noi non compileremo il tuo
codice quindi torniamo a niente, lo farò
disfare per un po ‘ci andiamo e così ora
siamo di nuovo tutti fantastici
Ho circa 15 minuti a sinistra, credo
fantastico quindi abbiamo fatto lotteria
roba abbiamo fatto un po ‘ di dati
roba che abbiamo esaminato la sintassi di Elm
ed esplorare come ci tiene al sicuro da
da errori di runtime ma non l’abbiamo fatto
anche in realtà come costruito un’app web e
questo è come il front end, quindi noi
dovrebbe probabilmente farlo, quindi abbiamo un
tutto un sacco di dati interessanti
ora vogliamo davvero entrare
costruendo un’app con Elm di cui abbiamo ancora bisogno
per iniziare a pensare ai dati in
funzioni e come si relazionano diversamente
dati insieme Elam ha alcune cose
costruito in alcune cose che puoi usare
per creare questo paradigma che richiede
vantaggio di quella proprietà di olmo e di
quei tipi speciali che ho menzionato
prima dei tipi di dati speciali che dicono
il runtime Elm vuole fare e creare
un’architettura intorno a questo è chiamato
nella comunità si chiama Elm
architettura perché ancora una volta abbiamo molto
nomi chiari, quindi è un
architettura su Elam che è l’ Olmo
architettura utilizza Elm HTML per HTML
cose e funziona in questo
paradigma di MV
tu il popolo delle cose MV così è
il modello di modello è come il coeso
rappresentazione unificata di ciò che è
accadendo nel nostro programma come un tipo di dati
aggiornamento che è U e M vu è come
quella cosa è autorizzata a cambiare
il tempo ha dato cose diverse che accadono
nella tua app e hai completato
controllo su ciò che sarà e
allora la vista è solo una funzione del
modello che lo converte in Dom virtuale
che il runtime eseguirà il rendering appena
come reagire tipo di fa o diverso
c’è un bel po ‘di cose
usa Dom virtuale ora così per poter ottenere
iniziato con questo ho bisogno di importare prima
HTML quindi abbiamo l’HTML e quindi lo sono
andando a importare HTML add suppongo alcuni
cose da HTML quindi ho intenzione di dire
come quando divi, intendo che lo faremo
h1 e h2
avremo bisogno del testo che è probabilmente buono per
ora forse avremo come un orizzontale
regola e quindi l’ app HTML 2 sta andando
per aiutarci a iniziare il nostro programma, così faremo
fare per iniziare con un main il principale è a
dice un tipo magico di funzione nell’elemento
questa è la roba che vogliamo che tu faccia
prendere da questo modulo e visualizzare al
utente
hai anche un tipo HTML quindi diremo
HTML di a perché HTML può causare
le cose accadranno e quelle cose hanno bisogno
avere un tipo pure e vedremo
che in un secondo quindi diremo quello principale
sta per essere un div tutte queste cose
appaiono queste sono funzioni così come me
continua a menzionare tutto in alamos a
funzione o dati quindi per le cose di vista è
tutto solo funzioni e dati di nuovo così noi
avere questa funzione div la prima cosa
sta per essere una lista di attributi così
Ho intenzione di dare questa lezione direi
come classe ciao e classe è anche a
funzione che restituisce un tipo di dati per
attributi su cui non vogliamo metterli
qui così
dare e lo metteranno in ciascuno e
lì inseriremo alcuni sguardi di testo
demo fantastica e poi sotto
avremo un altro div e poi qui
metteremo una persona di testo h2 sul palco
info baby metteremo un HR qui e
allora qui sotto ne avremo un altro
div e poi inseriremo del testo e
in questo testo renderizzeremo la persona
informazioni sul palco della persona sul palco, quindi sono
andando a compilare questo tutto sembra
bene quindi useremo il reattore um che io
all’inizio sopraffatto quindi cosa
questo andrà a fare un HTTP
server nella nostra directory che ci serve
e alcune belle cose di debugging e quando io
vai al sito vedremo un intero
elenco del nostro elenco qui così io
già creato questo index.html ma bene
mentre stiamo eseguendo il debug possiamo effettivamente
basta cliccare direttamente sul file Elm
ci interessa e verrà compilato
al volo e renderlo direttamente dentro
il nostro browser quindi c’è l’HTML che noi
reso staticamente ma questo è
sai che è bello ma è um
è statico e vogliamo creare un’app
quindi abbiamo bisogno di avere questo cambiamento così io
già parlato dell’aggiornamento Model View
e in realtà li creeremo
in questo momento, per esempio, conosci il tipo di alias
modella il modello questo programma è giusto
Sarai un conoscente, forse siamo utenti
avremo solo un’app che metterà qualcuno
sul palco e li toglie di nuovo
quindi faremo forse forse una persona piuttosto
questo è il nostro modello che è tutto il
informazioni che abbiamo bisogno di mostrare le nostre
applicazione per tenere traccia di ciò che è
in corso la parte successiva è l’aggiornamento
così aggiornamento consiste di due parti il
prima è una sorta di layout delle cose
che possono accadere nella tua app
e usiamo un tipo di Unione personalizzato simile
quindi diremo tipo e questi sono comunemente
i messaggi denominati lo abbreviano in questo modo
diremo i messaggi che i nostri
l’applicazione è autorizzata a inviare a se stessa
la nostra persona messa sul palco e prendere la persona
in realtà facciamolo, è a
un po ‘prolisso facciamo come vieni
indietro e vai via così gli aggiornamenti tendono ad avere
una firma che assomiglia a questo
quindi stiamo andando a prendere un messaggio uno di
quelle due cose che possiamo modellare
abbinarci più tardi e prenderemo qualsiasi cosa
il modello attuale è e torneremo
una nuova versione di quel modello così data a
messaggio nel modello possiamo dire caso
messaggio di tornare in modo che quando tornerà
entra , dirà che il modello è ora giusto
io e quando tutti si ammaleranno di me
essere qui dice che vai via, allora lo farà
non essere niente e questo è il nostro
l’applicazione è un sacco di cambiamenti quindi abbiamo
descritto l’ intero dominio per questo
sistema e il modo in cui è permesso
di modificarsi nella come 18 linee di
codice che include spazi bianchi e questo è
piuttosto bello e poi l’ultima parte è
la vista
quindi possiamo prendere tutto questo e tipo di
rifattilo in una funzione così poche
il nostro modello produce è un HTML che
invia i nostri messaggi così dato il modello
che è una persona forse prendiamo il
informazioni sulla persona sul palco per quel modello e
allora dobbiamo effettivamente mandarne alcuni
informazioni nella nostra app, quindi cosa?
ci permette di fare questo è eventi così siamo
interessato ai clic che stiamo per fare
fai i bottoni così avremo il bottone qui io sono
Avrai a fare clic su quei pulsanti così
siamo in un div separato ne avremo uno
pulsante che dice che un clic ritorna indietro
il testo tornerà e un altro
similmente andiamo via lasciate
faccio clic su e sul testo diremo andare
via così vediamo che copre tutto
Penso che lo faccia e poi l’ultimo passo
per collegare tutto questo basta dire questo è
Messaggio HTML scusa, piuttosto è un no
più solo HTML ora è un programma è
un programma totalmente legittimo così noi
potrei dire che questo è un programma con questo
scrivi mai il che significa che non c’è
non ci sono informazioni provenienti da
all’esterno abbiamo anche la possibilità di
fallo ma non lo faremo
in questo momento ha detto perché sono tutte le cose
diciamo HTML ad un programma per principianti che
è davvero fantastico per le demo come questo noi
dillo solo al modello iniziale
solo io sono qui in questo momento
la condizione iniziale per l’applicazione
come si aggiorna da solo è proprio questo
aggiornare funzione e come abbiamo vista
è solo la funzione di visualizzazione oh ah ah così
programma totalmente scritto sbagliato e così
me ne ha parlato così tornando al reattore
ricompiliamo quindi sono sul palco
adesso mi ingrandisco clicco via
piccolo trasferimento per dire che nessuno è sul
stadio e possiamo andare avanti e indietro solo
così, abbiamo definito un intero
modello di dominio per il suo modello di persone e
la loro presenza per rappresentare il palcoscenico
e poi abbiamo costruito un interattivo
applicazione completa con un bel layout
con HTML in solo circa 100 righe
di codice compresi gli spazi bianchi così veramente
conciso totalmente privo di errori di runtime
e assolutamente fantastico per la costruzione
fantastiche applicazioni front-end così è
tutto il codice che volevo mostrare ma io
avere un sacco di cose che puoi guardare
per iniziare il vostro viaggio di ottenere
coinvolto nella comunità molto velocemente
e poi ne prenderò solo uno
minuto per dirvi di me stesso al
certo che va bene
quindi questo è il lavoro di el mango ce n’è un mucchio
di esempi puoi scorrere qui
e scopri di più su Elm puoi provarlo
interattivamente nel tuo browser su Elm
lang org slash prova c’è un incontro qui
a Copenaghen, così puoi solo andare ad incontrarti
e scopri che c’è qualcosa di bello
le persone lì e tu dovresti assolutamente
unisciti al gioco è il più utile
aspetto di tutta la comunità che puoi
ottenere un feedback immediato da
membri della comunità e fare domande e
rispondi alle domande e così quella è Elma
Heroku app comm e molto velocemente
Sono Luke e lavoro in un’azienda chiamata
umile scintilla dove costruiamo utente
interfacce con JavaScript ed elm e
stiamo accettando un nuovo cliente che siamo
alla ricerca di un nuovo cliente quindi se hai bisogno
contribuire a costruire una cosa che faremo
aiuto e puoi trovarmi su twitter a
sottolineatura di Luca sottolineatura e
questo è tutto ciò che ho quindi sono pronto per
domande
così veloce il sistema di tipi è molto
simile al dattiloscritto puoi paranoia
il vantaggio di utilizzare un funzionale
linguaggio per lo sviluppo web che
dattiloscritto
non è spiacente penso che mi sia mancato
al centro di ciò puoi indicare il
vantaggio di utilizzare un funzionale sicuro così
il vantaggio di usare un funzionale
il linguaggio è che tipo di ti dà
questo paradigma di progettazione con
vincolo in modo da non essere dattiloscritto
hai tipi ma hai ancora il
opzione per non avere tipi se si utilizza il
qualsiasi tipo che non sia proprio un tipo
e puoi fare tutto quello che vuoi
quindi il tipo di Elm ti restringe
queste sono le cose che ti è permesso
lavorare con te ha solo stateless
funzioni che non possono creare effetti collaterali
e tu hai questo tipo di tipi e così
questo tipo di risposte un sacco di domande
per te su cosa sia la tua architettura
dovrebbe sembrare solo per essere un
linguaggio funzionale in modo da non dover
pensa tanto a come piace mettere come
legare insieme le cose , basta dire ok io
avere funzioni e ho dati e
questo è tutto ciò che ho e questo aiuta
a concentrarti sul problema che tu
necessità di risolvere, invece di cercare di capire
come va bene come faccio a usare dattiloscritto
E come faccio a usare quello per la progettazione di un bel
sistema buono non penso che abbiamo tempo per
niente di più, ma grazie Luca, giusto

Please follow and like us: