Torneremo.
Quindi ora stiamo andando a riprendere con il resto dei nostri percorsi riposanti.
Abbiamo fatto un indice e abbiamo preso una pausa per aggiungere al mantic tu. e. l'intestazione e il piè di pagina di Parshall.
Ora faremo di nuovo e creeremo in modo che alla fine di questo video quando clicco su un nuovo post
dovrei vedere un modulo e poi posso andare a quel modulo compilarlo e poi premere invio.
Mi riporterà alla pagina indice e dovrei vedere un altro post.
Quindi iniziamo.
La prima cosa che dobbiamo fare è creare la nuova rotta che ricordi i nuovi spettacoli come una forma.
È una richiesta di GET cani da slitta o blog slash tagliati nuovi e mostra solo un modulo.
Quindi iniziamo da lì.
Lo faremo dopo il nostro indice e aggiungiamolo qui.
Indice ha scritto.
Ora facciamo il nuovo percorso e aggiungerò anche a creare.
Quindi, per il nostro nuovo percorso e dopo aver ricevuto nuovi blog slash nuovi e nuovi, è davvero semplice.
È la più corta in realtà perché tutto ciò che dobbiamo fare è rendere sempre la stessa forma.
Non dobbiamo cercare nulla nel database.
Non è necessario inviare alcun dato al modulo.
Tutto ciò che dobbiamo fare è rendere nuovo.
E poi abbiamo bisogno di fare quel file, naturalmente.
Quindi, le visualizzazioni touch toccano nuove viste Ejay Yes C-9 nuove.
OK e iniziamo semplice.
E tutti noi usiamo una piccola interfaccia semantica qui.
Quindi faremo un div e questo dispositivo sarà semplice, ha solo un segmento del contenitore di testo principale di classe UI.
Quindi c'è un sacco di cose lì.
Lo romperò in un attimo.
E poi invece di aggiungere un'intestazione per farlo, possiamo fare un'intestazione enorme e
chiamiamo solo questo nuovo log.
E se lo vediamo, sapremo che ci siamo riusciti.
Quindi avvia l'app.
Oh e in realtà abbiamo bisogno di includere anche i nostri partial.
Altrimenti vedremo un diff, ma non vedremo nessuno degli stili semantici.
Ejay includano la barra dei punti della barra di Parshall stessa riga nella parte inferiore della barra di Parshall per il salvataggio.
Quindi abbiamo bisogno che i nostri
Aggiorna questa pagina e vai al blog nuovo.
E abbiamo due problemi.
Il primo è un problema di spaziatura.
Possiamo sistemarlo abbastanza facilmente, ma stiamo ottenendo il modello giusto.
Ma ho notato una cosa un po 'strana che è che la nostra icona è tornata ad essere piccola nella home page.
È grande su questa pagina è piccolo.
E ho passato un po 'di tempo a guardarlo come una specie di errore di erba.
L'avevo capito.
E 'davvero una di quelle frustranti che emergono ogni tanto, dove all'inizio non
è così ovvio, ma ti descriverò brevemente quello che ho notato.
Puoi vederlo nella console.
Non è riuscito a caricare il foglio di stile disattivare C S S, ma lo cercava sotto i blog infetti barra di
stile slash app che C S S e che non è dove dovrebbe apparire.
E così ho guardato il link che abbiamo impostato nel file di intestazione e ho notato che ho dimenticato una piccola cosa
come una barra.
Quindi se sei fresco ora vedrai che lo trova.
E non otteniamo un errore qui.
E se hai guardato nella scheda delle fonti puoi vedere che non guarda all'interno dei blog, per quello che è
per ora, al di fuori dei fogli di stile.
E ora finiamo con l'icona del codice più grande nel no.
Ora affrontiamo il problema, ora stiamo sovrapponendo il resto del nostro contenuto e risolvendolo è fortunatamente molto facile
ora che abbiamo impostato il foglio di stile.
Tutto ciò che dobbiamo fare è aggiungere un margine all'inizio di questo elemento che è l'elemento contenitore.
Tutto ciò che facciamo sarà all'interno di quel contenitore.
Quindi lo selezioneremo nel nostro foglio di stile dopo la valutazione e faremo semplicemente il contenitore e quindi tutto quello che vogliamo fare è margine
in alto invece di stare seduti in numero di pixel.
Userò anche E-M solo per vederlo più spesso.
Non l'abbiamo visto molto e vediamo che abbiamo un altro problema: il container che ispezioniamo
si trova anche nella barra di navigazione.
Ricorda che abbiamo un container lì.
anche contenitori principali o contenitori che sono anche segmenti o qualcosa di diverso dai contenitori generali.
Quindi vogliamo solo prendere come target le cose che sono
Quindi questa è un'altra facile soluzione.
Torneremo e mi faremo.
Quindi questo significa qualcosa.
Ho avuto entrambe le lezioni ora che ci aggiorniamo e sembra molto meglio.
Quindi non ci siamo sbagliati.
I margini di questo contenitore qui all'interno della Nav. il menu abbiamo appena giocato con questo qui e ora per
lo styling.
Ora facciamo in modo che il modulo funzioni.
Quindi, invece del nostro nuovo papà, sì, vogliamo formarci e la nostra forma è un po 'come questa dove va a tagliare i tronchi
che se hai dimenticato guardiamo i nostri percorsi riposati e puoi vedere creare cani in flash
come l'indice di un inviare.
Quindi questo modulo deve andare a slash logs dove il metodo è post e quindi all'interno di un form vuoi
alcuni input il primo sarà semplicemente type uguale a text proprio così e digitando close text e
gli darà un nome uguale al titolo del blog e poi un segnaposto uguale al titolo.
E poi duplicheremo quell'eccezione piuttosto che il titolo lo farà per l'immagine.
E questo dovrebbe essere una recensione da seduti alle richieste di post di alcuni
video e poi faremo la stessa cosa per
i contenuti che abbiamo chiamato body e semplicemente mettiamolo nel post di log qui come segnaposto.
Va bene così abbiamo fatto e quindi abbiamo bisogno di un modo per inviarlo in modo che faccia il
tipo di input equivale a presentare proprio così e quindi salvare e vedere ciò che otteniamo.
Ecco la nostra forma non proprio in stile.
Ci arriveremo presto.
Ma dovrebbe funzionare bene se inviamo che dovremmo ricevere un errore che dice che non è possibile pubblicare messaggi su barre.
Questo perché il nostro percorso di creazione non esiste.
Quindi facciamolo ora tagliando i cani come un post.
Quindi, invece di sì, sotto il commento Crea rotta, faremo un blog di post slash o Colback.
Perfetto e qui abbiamo davvero bisogno di creare quel nuovo blog.
Quindi abbiamo due passaggi per creare un blog, quindi eseguire un reindirizzamento e per il momento eseguiremo il reindirizzamento all'indice.
Quindi per creare il blog abbiamo bisogno di creare un blog e la prima cosa sono i dati.
Quindi non funzionerà ancora.
E la seconda cosa è la richiamata.
Quindi, con la nostra richiamata, possiamo iniziare con un errore.
E se funziona, avremo un nuovo blog e i dati che stiamo passando ricorderanno dal video sul post che è
tutto all'interno del punto dot dot body e qualsiasi cosa abbiamo chiamato nel nostro modulo nel
nostro modulo.
Tutto è all'interno di un blog e un gruppo e insieme.
Quindi, se chiediamo semplicemente al blog di scarico del corpo, esso ha automaticamente un'immagine e un corpo del titolo.
Diamo a questa richiesta un colpo di corpo. Prima discussione di agosto prende i dati che crea un nuovo blog quando
è fatto.
Causa questa richiamata.
E facciamo il nostro standard in caso di errore.
Facciamo una let invece di contare sulla registrazione, rendiamo di nuovo il nuovo modulo, faremo un reind reindirizzamento per
tagliare
i registri e dovremmo vedere il nuovo blog apparire lassù.
Se ha funzionato, spostiamo questo commento e vediamo cosa succede se gli diamo un colpo.
Quindi salveremo.
copia di questo URL immagine solo per avere un'immagine o un titolo del post del blog.
Dobbiamo riavviare il server e tornare alla radice per fare una
Ecco la nostra immagine nel nostro post sul blog.
Invia e funziona perfettamente.
E puoi vedere che abbiamo un titolo, un'immagine che mostra anche un post sul blog molto breve nella nostra data
di creazione.
Meraviglioso.
Quindi, per ricapitolare tutto ciò su rotte nuove e nuove è possibile tagliare qualunque sia il nome del modello.
I cani nel nostro caso sono in realtà dei blog e tu ricevi richieste.
Mostra che la forma di creazione è cani in flash, proprio come l'indice, tranne che è una richiesta di posta.
Ed è qui che il nuovo modulo invia i dati.
Per aggiungere al database creare un nuovo cane, quindi reindirizza nuovamente.
Non deve essere l'indice per la maggior parte del tempo in realtà per mostrare la pagina che vedrai
nel prossimo video.
Definiamo rapidamente la nostra applicazione.
Facciamo il modulo.
dell'interfaccia utente e quindi all'interno di quella forma ognuno di questi input sarà in un div e quel div avrà una classe uguale ai campi.
Quindi, usare la prima cosa semantica che faremo è dare al nostro modulo una classe uguale alla forma
E poi guarda come etichettare in cui non abbiamo ancora.
E la prima etichetta sarà il titolo e poi prendiamo il nostro titolo e lo mettiamo lì.
Perfezionare.
E poi lo faremo ancora un paio di volte.
Abbiamo bisogno di uno di questi per l'immagine cambiare l'etichetta dire immagine e quindi una modifica che voglio fare
è che invece di avere il nostro blog da input come questo voglio renderlo un'area di testo dove un utente
può digitare un po 'di testo come un vero post sul blog.
E per aggiustare questo piuttosto che rendere questo un input, avremo un div Chrisfield ancora nell'etichetta
e lo chiameremo solo contenuto del blog ma piuttosto che questo input aggiungeremo un tag dell'area di testo che
abbiamo visto presto ma non abbiamo usato molto.
Ed è un po 'diverso dagli input, gli diamo ancora un nome.
Quindi continuiamo a scrivere sul corpo del blog e poi salviamo ma non gli diamo un tipo di testo perché non è un input, è un tag
designato che ha un tag di apertura e chiusura e si comporta in modo leggermente diverso.
Quando arriveremo ad aggiungerlo.
Quindi vedremo che in un attimo ci libereremo di quello e poi modificheremo il nostro pulsante.
Diamo un'occhiata a ciò che abbiamo ora.
Sembra abbastanza buono, tranne il pulsante potrebbe essere in stile un po 'più bello.
E se apro l'interfaccia semantica e vai al pulsante ci sono molti più pulsanti in semantico che in Bootstrap.
Così diversi tipi, ma anche molti colori pulsanti di base e quindi anche i pulsanti invertiti.
Quindi scegli uno di questi che ti piace e quando vai con il preferito facciamo viola viola e se dai un'occhiata al codice sorgente
tutto ciò di cui hai bisogno è una classe uguale a te.
Il pulsante di base del colore.
E mentre lo faccio spiegherò perché si chiama interfaccia semantica.
E la ragione principale è che a differenza del bootstrap, dove abbiamo questo strano gergo ETN ETN e LGBT di
dash per esempio che detesto il bootstrap in realtà non lo colpisce, ma la ragione
per cui è stato creato il sematic era in risposta a questo tipo di markup dove invece possiamo avere UI violare il pulsante di base
o posso fare il pulsante UI Violet invertito.
Quindi base per ora va bene.
E questo è tutto ciò che serve.
Molto semplice.
Non è che siano meno personaggi.
Non si tratta di essere più brevi.
Si tratta di essere significativi dove puoi facilmente guardare a questo e capire cosa significa.
Quindi se torniamo indietro adesso e aggiorniamo.
Ho quel pulsante e se voglio renderlo grande è davvero facile.
Tutto quello che devo fare è digitare grande.
Quindi non devo fare BT e lanciare Elgie solo un grande aggiornamento e otteniamo un pulsante più grande e basta.
Quindi proviamo di nuovo.
Voglio dire, io uso lo stesso audace argomento, chiamiamolo il mio nuovo cane.
Altro blog Contac invia e funziona bene.
Grande.
Va bene quindi abbiamo un indice coperto che abbiamo coperto Nuovo e creato e ti ho mostrato un po
'di semantica Potresti ottenere i moduli e i pulsanti nel prossimo video.
Lavoreremo sulla pagina dello spettacolo