Torneremo.
Quindi riprendiamo da dove eravamo rimasti.
Abbiamo coperto l'indice new create.
Ora stiamo andando avanti per mostrare.
Quindi di nuovo il punto della pagina dello spettacolo è che mostra tutte le informazioni
o più informazioni nell'indice su un particolare elemento e il percorso ha un'idea in esso.
Quindi i nostri saranno i blogger I. D. L'ID riceve inizialmente la richiesta.
dice di leggere di più e che ci porterà alla pagina dello show e poi andremo a dare uno stile allo show modello solo un po '.
Siamo stati pochi gli obiettivi nella serie di percorsi del modello, quindi vogliamo avere dei link in modo
che nella pagina dell'indice possiamo avere un pulsante che
Iniziamo definendo il percorso.
Quindi, dopo la nostra creazione, aggiungeremo un altro commento e questo deve essere un attore per cui i
blog di barra tagliano la richiesta e la risposta dell'ID dei due punti e salvano e possiamo fare il semplice comando di invio della pagina di presentazione.
Assicurati che funzioni.
Quindi riavvia il
server e possiamo andare al blog slash e vedere la pagina dello show.
Ovviamente le idee saranno lunghe idee di mangusta che sembrano così e non scriveremo questo, ma faremo clic
sui collegamenti per vederli.
Quindi lasciaci fare ora torniamo indietro e aggiungiamo un link alla pagina dello spettacolo sull'indice in modo che possiamo avere
un pulsante che dice Leggi più qui accanto al post stesso.
Questo ci porterà alla pagina dello spettacolo.
Quindi, nel nostro modello di indice, se lo apriamo al posto delle viste, la prima cosa
che faremo sarà subito dopo che il corpo del blog aggiungerà un tag di ancoraggio e dirà solo di leggere di più e l'H ref sarà il registro delle barre.
Ma quell'ID è variabile attraverso ogni blog.
Quindi abbiamo bisogno di ogni Sì.
E questo deve essere un punto di sottolineatura del blog, l'ID salverà il riavvio.
Ora disponiamo di un link e se clicchiamo su di esso guardiamo tutti gli slash registrati.
5 6 3 mentre blah blah.
La stessa cosa qui con un ID diverso.
Va bene, ora dobbiamo compilare la logica del percorso che dovrebbe prendere questo ID per trovare
il blog corrispondente e quindi rendere il modello dello spettacolo Iniziamo trovando il registro corretto all'interno
di tale percorso.
Quindi la meth dei manglers che usiamo è un punto blago trovato per ID e che prende due argomenti l'ID e
il callback.
Quindi, l'ID è proprio qui richiesta dot harams che ID e il nostro tasso di callback avranno
un errore e quindi lo chiameremo blocco trovato.
Eccoci.
Controlleremo nuovamente l'errore se mai.
E facciamo semplicemente qualcosa.
Faremo un reindirizzamento alla pagina dell'indice.
Alla fine ti mostrerò una gestione degli errori molto più bella, in cui possiamo mostrare un messaggio che dice che il
registro non è stato trovato o mi dispiace non trovarlo e ti riporto alla pagina in cui ti trovavi.
Ma per ora torneremo sempre su Smashbox ma non dovrebbe esserci nulla che possa causare errori nei
mouse.
Il nostro database è completamente spento o qualcosa del genere.
Quindi a questo punto non importa per noi Reds rende il modello dello show e dobbiamo passare
nel sound blog e lo chiameremo semplicemente blog.
Quindi il blog trovato all'interno del modello si chiamerà Blog.
Ora abbiamo bisogno di quel modello di spettacolo.
Quindi facciamolo ora.
Le visualizzazioni touch mostrano che Aegeus lo ha aperto e qui inizierò
effettivamente a copiare ciò che ho in New, che è una forma e non vogliamo nulla di tutto
ciò.
Quindi quello che vogliamo è parte di questa roba di base come il segmento dei contenitori di testo principale dell'interfaccia
utente dell'intestazione, che manterremo per ora.
suo interno invece di un enorme hetter aggiungiamo il titolo del post e il titolo dovrebbe essere il titolo del blog.
Ma al
Salviamolo
E vediamo se funziona.
Quindi, di nuovo il blog è ciò che abbiamo trovato all'interno dello spettacolo proprio qui.
L'abbiamo cercato con l'ID registrato per ID trovato se lo troviamo se non è stato trovato alcun errore passato floggato
sotto il log dei nomi al modello dello show nel modello dello show.
Stiamo usando blog.
Tutto ok.
Moment of
Truth facciamo uno veloce di questi link li andiamo primo post.
Quindi se clicco su questo dovresti vedere il mio nuovo cane.
E lo facciamo
Grande.
Quindi abbiamo le basi.
La parte difficile è davvero fatta.
Ora si tratta solo di visualizzare le informazioni che vogliamo mostrare.
Quindi torneremo e vorremmo sicuramente visualizzare l'immagine.
Vogliamo anche mostrare il contenuto.
Quindi ne ruberò un po 'dall'indice.
Abbiamo già tutto questo scritto ora e lo modifichiamo un po 'diversamente qui.
Eccoci.
Iniziamo con questo.
Ma lo faremo più bello.
Vediamo cosa otterremo se ci aggiorniamo.
C'è il nostro post.
Ecco la nostra pagina di presentazione.
Una cosa che vale la pena notare è che al momento questo non mostra nulla che non vediamo
nell'indice e questo perché il nostro indice mostra tutto.
Ma la maggior parte dei blog è che mostrano parte del post.
Quindi, se avessimo un post sul blog Line 10000, non vogliamo che occupi 10000 righe qui.
Piuttosto potresti avere un'anteprima di un paragrafo o giù di lì e poi fai clic su Leggi di più e lo faremo
in un attimo.
Ma iniziamo disegnando questo un po '.
La prima cosa che abbiamo è il nostro contenitore di testo principale.
Abbiamo un'intestazione enorme.
E poi all'interno di quello puoi aggiungere un altro div dove stiamo andando a mettere tutto
all'interno di quel div e dargli una classe uguale al segmento in alto dell'interfaccia utente.
Quello che fa il segmento è mettere un piccolo margine attorno alle cose, quindi
sembra invece che tu aggiunga una classe div uguale all'elemento e poi anziché l'oggetto stiamo mettendo tutto il nostro contenuto.
classe semantica chiamata te ho centrato l'immagine che è di quattro classi.
Quindi inizierò con l'immagine e invece di visualizzare solo l'intera immagine come è possibile aggiungere una
Quindi io immagine ti fornirà semplicemente una bella immagine dell'interfaccia semantica, ma se la diamo centrata centrerà l'immagine
in quel contenitore in arrotondato gli darà degli angoli arrotondati.
Non sarà circolare.
Puoi farlo con l'immagine del cerchio o l'immagine circolare, ma arrotondato cambia
leggermente gli angoli.
Vediamolo per iniziare.
Eccoci.
Ci stiamo avvicinando e poi entreremo qui e aggiungeremo un altro dispositivo.
Questo sarà di classe pari al contenuto se vuoi sapere da dove vengo.
Se vai su item item item sull'interfaccia utente semantica Qui è dove sto prendendo.
Quindi abbiamo un elemento div invece di un elemento possiamo avere un'immagine e quindi il contenuto che è esattamente quello che ho
fatto.
Quindi abbiamo un oggetto con contenuto all'interno e questo non è proprio lo scopo.
Dopo questo, non sarai un esperto di interfaccia utente semantica.
mostrarti un altro quadro ma non per farti conoscere come esperto in semantica.
È ancora solo per
Va bene così, invece, aggiungeremo nel nostro caso ciò che hanno creato proprio così e risparmieremo
un piccolo cambiamento, sebbene questo non sia l'ideale per un utente per vedere cosa possiamo
fare cambiando molto facilmente in una data più leggibile.
E ci sono alcuni metodi con date javascript.
Ce n'è uno chiamato due stringhe.
C'è una chiamata alla stringa di date che è ciò che vogliamo e ti mostrerò come si presenta.
lo chiamo qui e aggiorno la notifica che ora ho aggiornato, ricevo una versione inglese leggibile dall'inglese.
Se solo
Domenica 1 novembre 2015.
Perfezionare.
Quindi lo salveremo.
Continuiamo a lavorare un po 'qui.
div è chiamato description e questa è
un'altra classe
semantica invece di lì e questo al nostro paragrafo proprio così e aggiorna la pagina.
Aggiungiamo un altro
E abbiamo un post sul blog relativamente fatto per ora.
Mi libererò di questo div con una linea al suo interno.
Non abbiamo bisogno di quella linea.
E questo è dal segmento che abbiamo qui.
Quindi, se ci liberiamo di quello e manteniamo il segmento esterno, finiamo con questo o possiamo fare il contrario
e sbarazzarci del segmento esterno e mantenere quello interno proprio come questo.
Qualunque cosa pensi sia meglio.
Penso che tornerò e manterrò sicuro quello esterno.
Totalmente se tu.
Tutto ok.
Ora prendiamo alcuni post nel nostro database che ho un testo più lungo da visualizzare o copiare alcuni lorem ipsum.
È così.
E se torniamo nuovo post questa volta ho un'immagine diversa che ti sbagli.
Sarò sorpreso.
E chiamerò questo nuovo post con un testo più lungo.
Titolo terribile.
Invia e otteniamo questa gigantesca immagine qui non la stiamo stilando.
E poi otteniamo molto testo.
Quindi ovviamente non vogliamo tutto questo testo nella pagina dell'indice che funzionerà su questo.
E se clicco su Leggi di più e ora ottengo il mio bel post sul blog ma nota che tutto è condensato.
Non hai quelle linee di paragrafo che volevamo.
Non è possibile aggiungere interruzioni intermedie.
tu se mai blog per qualche variante di HVM ora qualcosa come Wordpress o se usi qualcosa come medium.
Quindi, per rendere questo blog un po 'più utilizzabile, dovremmo lasciare che gli utenti inseriscano HVM che
probabilmente hai visto se
Non scrivi ogni T. M. te stesso ma puoi rendere le cose in
grassetto puoi includere immagini che puoi includere paragrafi in corsivo testo.
Bene, se lo facciamo ora, se proviamo a fare un nuovo post, manterrò di nuovo la stessa immagine.
E rubiamo di nuovo Lorem Ipsum.
Solo una parte di questo facciamo qualcosa di ovvio come una forte etichetta attorno ad alcuni di questi.
Quindi se funzionasse avremmo visto un testo in grassetto e inviare e mi ero dimenticato di stringere.
Va bene.
E vedrai che il nostro contenuto viene visualizzato ma non viene eseguito.
Non è mostrato come un timeout e c'è una buona ragione per ciò che è che non è
sempre così sicuro lasciare che gli utenti inseriscano il proprio codice HVM e semplicemente lo eseguano.
E potresti pensare a quale sia la cosa peggiore che possa accadere.
Lo ha solo scolpito.
Bene, ciò che può accadere è che qualcuno potrebbe effettivamente inserire un tag script in esecuzione Javascript.
Quindi te lo mostrerò più tardi.
Al momento però va bene perché non stiamo effettivamente visualizzando la quantità di HD.
Se volessimo, è davvero un cambiamento un personaggio in realtà.
Quindi questo è il modello dello spettacolo.
E se guardiamo il modello dello show in questo momento stiamo visualizzando blog dot body.
Se cambio questo segno di uguale a un trattino, beh, quello che effettivamente fare è prendere qualsiasi blog che il
corpo restituisca e valutarlo.
Eseguilo come codice invece di visualizzare semplicemente la stringa.
Quindi, se aggiorno la pagina, ora otteniamo il nostro tag forte proprio lì.
E se me lo aspettassi, vedresti che è un vero tag forte.
Quindi cambiarlo da un segno di uguale a un trattino è davvero potente.
Quindi valuta effettivamente il codice.
Quindi, se facciamo un altro post, la stessa immagine e questa volta facciamo un primo paragrafo e il paragrafo
di chiusura e poi lo duplichiamo e poi una volta ottenuto qualche larm ipsum e appena rubato alcune di queste righe.
Avremo solo due semplici paragrafi.
Vedrai che finiamo ora
dopo le nostre immagini giganti finiamo con due paragrafi qui.
Il che è fantastico perché ora un utente può effettivamente inserire contenuti e specificare lo stile.
Ma ecco un problema.
Quindi se inserisco qualcosa di casuale qui posso fare questo script e posso semplicemente digitare
del codice qui e fare semplicemente qualcosa di stupido come ti ho chiesto.
Sicuro.
Tutti questi sono errati.
E se inserisco questo ora questo è HDMI che verrà eseguito ed è un tag script
che significa che verrà eseguito uno script di lavoro.
Quindi quando vado a quella pagina ora ricevo quell'avviso.
Ovviamente un singolo avviso non è poi così male, ma probabilmente potresti immaginare che le cose possano
aumentare da lì.
Ci sono modi per prevenire il problema di eliminare qualsiasi tag di script.
Ti mostrerò come farlo alla fine è un video opzionale in questa serie.
Si chiama sanificazione dei nostri input.
Lì se c'è un pacchetto chiamato l'igienizzatore Express che lo farà per noi.
Diciamo solo di disinfettare la proprietà che si sbarazzerà di qualsiasi tag di script al suo interno.
Non dobbiamo scrivere quel codice.
OK.
Quindi torniamo anche se abbiamo alcuni problemi.
Una di queste immagini.
Sì, torneremo allo stile di questi.
Ma iniziamo troncando questi post in modo da non vedere tutti questi contenuti nella pagina dell'indice.
Lasciamo che siano i primi 100 caratteri e poi mettiamo un puntino di sospensione.
Quindi delimitare una stringa.
In realtà è davvero semplice.
Abbiamo visto subito quando abbiamo parlato di javascript che usiamo il metodo della sottostringa.
Quindi nella nostra pagina indice invece che l'intero corpo del blog si intaserà la sottostringa del corpo zero prima carattere fino
a quando.
E vogliamo il centesimo carattere ish che va bene per ora.
E ho sempre capito male.
È una sottostringa in minuscolo.
Sembra che dovrebbe essere un caso di cammello come se fossero due parole, ma non lo è.
Tutto ok.
Quindi ora se proviamo questo, vedi che ora abbiamo questi messaggi troncati e aggiungiamo semplicemente i semplici
ellissi qui.
Quindi sottostringa e quindi all'esterno di quel sì punto punto punto e poi abbiamo il nostro link di rifrazione.
Quindi ora la nostra pagina mostra ha uno scopo in cui vediamo un po '.
E poi puoi cliccare di più e vedere l'intero post.
Grande.
Quindi abbiamo parlato molto in questo video.
Hai parlato dello show parlato dell'utilizzo dell'ID nel percorso come fare per ottenere le richieste.
Abbiamo impostato il percorso che abbiamo preso l'ID e trovato il blog corrispondente, quindi abbiamo reso un modello.
Ma abbiamo anche parlato di alcune novità, incluso il modello dello show usando il trattino qui piuttosto che un segno
di uguale che effettivamente renderà il codice per eseguire il codice e renderizzare il risultato.
E poi abbiamo anche visto una stringa che è un bel modo di trasformare una data in un formato migliore.
Non è ancora così flessibile.
Ci sono grandi librerie che si chiamano Moment Jap's che ti permettono di specificare il formato esatto
che vuoi.
Potremmo volere qualcosa che assomigli al taglio del mese del giorno dell'anno e potremmo volere qualcosa in cui il mese
è abbreviato o potremmo volere l'intero mese e l'intero giorno della settimana
anziché Sun in novembre.
Puoi farlo con il momento in cui J è il modo migliore di gestire le date se vuoi essere molto esplicito
nel formato che desideri.
È solo una semplice libreria che puoi installare proprio come Jay Querrey o qualsiasi altra libreria laterale del client, ma
per ora ci occuperemo di questo.
Costruito in javascript.
Non abbiamo bisogno di altro codice oltre a una singola linea qui.
Grande.
E poi l'ultima cosa con l'utilizzo della sottostringa invece di un indice che è più per una vista che non
l'hai vista da un po ', ma lo abbiamo visto presto.
Il primo argomento è dove vogliamo fare il primo taglio, il secondo argomento è dove vogliamo fare il
secondo taglio.
Prendiamo tutto in mezzo.
Grande.
Tutto ok.
Il prossimo video su cui lavoreremo sarà aggiornato e modificato