우리는 다시 올 것이다.
그래서 우리는 우리가 중단했던 곳에서 데리러 갈 것입니다.
새로운 색인 생성에 대해 살펴 보았습니다.
이제 우리는 계속해서 나아갈 것입니다.
다시 한번 쇼 페이지의 요점은 하나의 특정 항목에 관한 모든 정보 나 정보를 인덱스에 표시하고 경로에 아이디어가 있음을 다시 한 번 나타냅니다.
그래서 우리는 블로거들이 I.D. ID가 처음 요청을받습니다.
우리는 몇 가지 목표를 쇼 루트에서 템플릿으로 만들었습니다. 그러면 링크가 있기를 원합니다. 인덱스 페이지에서 더 많이 읽으면 쇼 페이지로 이동 한 다음 쇼 스타일을 지정합니다. 템플릿 조금.
경로를 정의하여 시작합시다.
그래서 우리가 만든 후에 우리는 다른 주석을 추가 할 것이고 이것은 배우가되어야합니다. 슬래시 블로그는 콜론 ID 요청과 응답을 저장하고 저장해야합니다. 우리는 시작하기 위해 쇼 페이지를 보내는 것처럼 간단하게 할 수 있습니다.
이 방법이 효과가 있는지 확인하십시오.
그래서 서버를 다시 시작하면 블로그를 살펴보고 쇼 페이지를 볼 수 있습니다.
물론 아이디어는 그렇게 보이는 긴 몽구스 아이디어 일 것이며 우리는 이것을 타이핑하지 않고 링크를 클릭하여 볼 수 있습니다.
이제 다시 돌아가서 인덱스의 쇼 페이지에 대한 링크를 추가하여 포스트 바로 옆에있는 더 읽기 버튼을 가질 수 있습니다.
그러면 쇼 페이지로 이동합니다.
그래서 우리의 인덱스 템플릿에서보기 대신에 열면 가장 먼저 할 일은 블로그 본문에 앵커 태그를 추가 한 후 더 자세히 읽고 H ref가 슬래시 로그가 될 것입니다.
그러나 ID는 각 블로그를 통해 다양합니다.
그래서 우리는 각각 필요합니다.
그리고 그 블로그 ID가 밑줄 ID가 필요 다시 시작을 저장합니다.
이제 링크가 생겼고 클릭하면 모든 로그 슬래시가 보입니다.
동안 5 6 3.
여기 다른 ID로 똑같은거야.
좋아, 이제 우리는이 ID를 취해야하는 루트의 논리를 채워야합니다. 해당 블로그를 찾아서 쇼 템플릿을 렌더링합니다. 해당 쇼 경로에서 올바른 로그를 찾아서 시작하십시오.
그래서 우리가 사용하는 맹 글링 도구는 ID로 찾아낸 블레이크 점입니다. ID와 콜백이라는 두 가지 인수가 필요합니다.
그래서 ID가 바로 여기에 도트 하람을 요청하고 그 ID와 콜백 속도에 오류가있을 것입니다. 그러면 우리는 발견 된 잠금이라고 부를 것입니다.
우리는 거기에 갈.
오류가 있는지 다시 확인합니다.
그리고 간단한 것을 해보 죠.
우리는 다시 색인 페이지로 리다이렉션을 할 것입니다.
결국 저는 로그를 찾을 수 없다는 메시지를 표시 할 수있는 오류 처리 방법을 많이 보여 주거나 죄송합니다. 블로그를 찾을 수 없으며 방금 방문한 페이지로 돌아갈 것입니다.
그러나 지금은 항상 스매쉬 박스로 돌아갈 것이지만 마우스에 오류를 발생시키는 것은 없어야합니다.
우리 데이터베이스가 완전히 차단되었거나 뭔가가 있습니다.
그래서 이것은 정말로 우리에게 중요하지 않습니다. 그렇지 않으면 Reds는 쇼 템플릿을 렌더링하고 우리는 사운드 블로그를 전달해야하며 우리는 블로그라고 부를 것입니다.
이렇게 템플렛 안쪽에 찾아낸 blog는 Blog에게 불릴 것이다.
이제 쇼 템플릿이 필요합니다.
그럼 이제 시작하겠습니다.
터치보기는 Aegeus가 그걸 열어 놓은 것을 보여 주며 여기서 저는 실제로 제가 가지고있는 것을 새로운 형태로 복사하기 시작할 것입니다. 이것은 양식이고 우리는 그것을 원하지 않습니다.
그래서 우리가 원하는 것은 헤더 UI 기본 텍스트 컨테이너 세그먼트와 같은 기본적인 것들 중 일부입니다.
그러나 거대한 hetter 대신 그것의 내부에 게시물의 제목을 추가하고 제목은 블로그 제목이어야합니다.
저장하겠습니다.
그리고 그것이 작동하는지 봅시다.
다시 블로그는 우리가 쇼의 내부에서 발견 한 모든 것입니다.
ID가 기록 된 ID로 찾아 보았습니다. 오류가 발견되지 않은 경우 ID로 찾기를 실행하고 쇼 템플릿의 쇼 템플릿에 이름 로그 아래로 물결 치는 것을 발견했습니다.
우리는 블로그를 사용하고 있습니다.
괜찮아.
진실의 순간은 우리가 첫번째 포스트에가는이 연결의 빠른 것하자.
그래서이 버튼을 클릭하면 내 새 개를보아야합니다.
그리고 우리는 그렇게합니다.
큰.
그래서 우리는 기본을 가지고 있습니다.
정말 어려운 부분.
이제 우리가 표시하고자하는 정보를 표시하는 것입니다.
그래서 우리는 되돌아 갈 것이고 분명히 이미지를 보여주고 싶을 것입니다.
우리는 또한 내용을 표시하고 싶습니다.
그래서 색인에서 그 중 일부를 훔칩니다.
우리는 이미이 모든 것을 이미 작성했으며 우리는 여기에서 약간 다르게 스타일을 지정할 것입니다.
우리는 거기에 갈.
우리는 이것으로 시작할 것입니다.
그러나 우리는이 모습을 더 멋지게 만들 것입니다.
우리가 새로 고침하면 우리가 얻는 것을 보자.
우리의 게시물이 있습니다.
여기 쇼 페이지가 있습니다.
주목할 가치가있는 한 가지는 현재 색인에 표시되지 않는 항목이 표시되지 않으며 색인에 모든 항목이 표시되어 있기 때문입니다.
그러나 대부분의 블로그는 게시물의 일부를 보여줍니다.
그래서 우리가 10000 Line 블로그 포스트를 가지고 있다면, 여기에 10000 라인을 차지하지 않기를 바랍니다.
오히려 당신은 단락의 미리보기를 가질 수 있습니다. 그런 다음 더 많은 것을 읽으십시오. 그러면 우리는 잠시 후에 그것을 할 것입니다.
그러나 이것을 약간 스타일링하여 시작합시다.
우리가 가지고있는 첫번째 일은 우리의 메인 텍스트 컨테이너입니다.
우리는 거대한 머리말을 가지고 있습니다.
그리고 그 안쪽에 다른 div를 추가하여 div의 내부에 모든 것을 넣고 UI 상단 첨부 세그먼트와 동일한 클래스를 제공 할 수 있습니다.
어떤 세그먼트는 사물 주위에 약간의 경계선을두기 때문에 항목 대신 div 클래스를 추가하려고하는 대신에 우리는 모든 내용을 넣고 있습니다.
그래서 이미지로 시작하고 단지 전체 이미지를 표시하는 것이 아니라 어떻게 우리가 4 개의 클래스 인 이미지를 중심으로 한 의미 론적 클래스를 추가 할 수 있는지를 보여줄 것입니다.
그래서 저는 이미지를 통해 멋진 의미의 UI 이미지를 얻을 수 있습니다.하지만 이미지를 가운데에 배치하면 해당 컨테이너의 이미지를 가운데에 배치하여 둥근 모서리를 둥글게 만듭니다.
그것은 원형이 아닙니다.
당신은 원 이미지 나 원형 이미지가 둥근 것 같아서 그것을 할 수 있습니다.
시작하자.
우리는 거기에 갈.
우리는 점점 가까워지고 있습니다. 그리고 우리는 여기에 들어가서 다른 장치를 추가 할 것입니다.
당신이 내가 이것을 어디에서 얻고 있는지 알고 싶다면이 것은 수업 내용과 같을 것입니다.
시맨틱 UI에서 항목보기 항목으로 이동하는 경우 여기에서 가져옵니다.
그래서 우리는 항목 대신 div 항목을 가지고 있습니다. 우리는 이미지를 가질 수 있고 그 다음에 내가 한 일을 정확하게 처리 할 수 ​​있습니다.
그래서 우리는 내부에 내용이 담긴 아이템을 가지고 있습니다.
이 후에는 의미 론적 UI에 대한 전문가가 될 수 없습니다.
다시 한 번 다른 프레임 워크를 보여 주지만, 의미 론적 전문가로 만들 수는 없습니다.
좋습니다. 대신에 우리는 그 대신에 우리가 만든 것과 같은 것을 만들어 내고 하나의 작은 변화를 구할 것입니다.하지만 이것은 사용자가 우리가 할 수있는 것이 매우 쉽게 변화한다는 것을 보는 것이 이상적이지 않습니다. 그게 더 읽기 쉬운 날짜로.
자바 스크립트 날짜가있는 몇 가지 메소드가 있습니다.
하나는 두 개의 문자열이라고합니다.
데이트 스트링에 전화 한 사람이 있는데, 그 사람이 원하는 것을 보여줄 것입니다.
방금 내가 여기 부르고 새로 고침을하면 새로 고침을하고 좋은 영어의 사람이 읽을 수있는 버전을 얻습니다.
2015 년 11 월 1 일 일요일.
완전한.
그래서 우리는 그것을 구할 것입니다.
여기서 조금만 더 노력합시다.
다른 div를 description이라고 부르겠습니다.이 대신에 다른 semantic class가 있습니다. 우리 단락과 마찬가지로 페이지를 새로 고칩니다.
그리고 우리는 지금 상대적으로 블로그 포스트를 가지고 있습니다.
나는이 div를 내부의 선으로 제거 할 것이다.
우리는 그 라인이 필요하지 않습니다.
그리고 그것은 우리가 여기있는 부문에서 나온 것입니다.
그래서 우리가 그 중 하나를 없애고 우리가 바깥 쪽 부분을 유지한다면 우리는 이것으로 끝나야합니다. 그렇지 않으면 우리는 바깥 쪽 부분을 제거하고 내면 부분을 이와 같이 유지할 수 있습니다.
당신이 생각하는 것이 가장 좋습니다.
나는 돌아가서 바깥 쪽을 확실히 지킬 것이라고 생각한다.
너라면.
괜찮아.
이제 데이터베이스에서 일부 게시물을 가져 와서 일부 lorem ipsum을 표시하거나 복사하는 텍스트가 더 길어 지도록하겠습니다.
그것은 이것과 같습니다.
이번에 새 게시물로 돌아 가면 나는 다른 이미지를 가지고 있습니다.
나는 놀랄 것이다.
그리고 나는이 새로운 글을 더 긴 텍스트로 부르겠다.
끔찍한 제목.
제출하고 우리는이 거대한 이미지를 얻습니다. 우리는 그것을 스타일링하지 않습니다.
그리고 나서 많은 텍스트를 얻습니다.
그래서 분명히 우리는이 텍스트를 모두 색인 페이지에 쓰고 싶지는 않습니다.
그리고 내가 더 많은 것을 읽는다면, 지금 나의 좋은 블로그 포스트를 여기에서 얻는다. 그러나 모든 것이 응축된다고 알아 차린다.
당신은 우리가 원했던 단락 선을 가지고 있지 않습니다.
그 사이에 휴식을 추가 할 수 없습니다.
그래서 이것을 좀 더 유용한 블로그로 만들려면 사용자가 HVM을 입력하도록해야합니다. HVM의 몇 가지 변종을 WordPress와 같이 블로그에 올리거나 매체와 같은 것을 사용한다면 지금 보셨을 것입니다.
당신은 각 T.M을 쓰지 않습니다. 너는하지만 굵은 것을 만들 수있다. 단락을 포함 할 수있는 이미지를 포함 할 수있다. 이탤릭체 텍스트.
글쎄, 우리가 그렇게한다면 우리는 새로운 포스트를 만들려고 다시 같은 이미지를 유지할 것이다.
그리고 그 Lorem Ipsum을 다시 훔치자.
이 중 일부는이 태그 중 일부를 둘러싼 강력한 태그처럼 명백한 것을 수행합니다.
그래서 그것이 효과가 있었다면 우리는 굵은 텍스트를 보았고 제출하고 나는 묶는 것을 잊어 버렸습니다.
괜찮아.
우리 콘텐츠가 표시되지만 실행되지는 않습니다.
타임 아웃으로 표시되지 않고 사용자가 자신의 HVM 코드를 입력하고 실행 만하는 것은 항상 안전하지는 않다는 좋은 이유가 있습니다.
그리고 일어날 수있는 최악의 상황은 무엇 일지 생각할 수도 있습니다.
그냥 그를 밖으로 에칭.
글쎄, 누군가가 실제로 Javascript를 실행하여 스크립트 태그를 입력 할 수있다.
그래서 나중에 보여 드리겠습니다.
지금은 HD 금액을 표시하지 않기 때문에 괜찮습니다.
우리가 원한다면 실제로는 아주 단순한 하나의 성격 이죠.
이것이 바로 쇼 템플릿입니다.
그리고 쇼 템플릿을 보면 블로그 도트 시체가 표시됩니다.
이 등호를 대시로 변경하면 실제로 수행 할 블로그는 본문이 반환 한 블로그를 가져 와서 평가합니다.
단순히 문자열을 표시하는 것이 아니라 코드로 실행하십시오.
페이지를 새로 고침하면 바로 여기에 강력한 태그가 표시됩니다.
그리고 내가 기대한다면, 그것은 당신이 실제로 강한 태그라는 것을 알 것입니다.
따라서 등호에서 대시로 변경하면 정말 강력합니다.
그런 다음 실제로 코드를 평가합니다.
그래서 우리가 다른 이미지를 게시하고 이번에는 첫 번째 단락과 닫는 단락을 작성한 다음 복제하여 단 한 번의 ipsum을 얻고이 라인 중 일부를 훔칩니다.
우리는 단지 두 개의 간단한 단락을 갖습니다.
거대한 이미지가 끝난 후에 우리는 이제 두 단락으로 끝납니다.
이제는 사용자가 실제로 콘텐츠를 입력하고 스타일을 지정할 수 있기 때문에 어느 것이 좋습니다.
그러나 여기에 문제가 있습니다.
그래서 무작위로 여기에 들어가면이 스크립트를 할 수 있습니다. 여기에 코드를 입력하면 내가 당신에게 물어봤을 때 어리석은 짓을 할 수 있습니다.
확실한.
이 모든 것은 철자가 잘못되었습니다.
그리고 지금 내가 이것을 입력하면 이것이 실행될 HDMI이고 이것이 작업 스크립트를 실행한다는 것을 의미하는 스크립트 태그입니다.
그래서 지금 그 페이지로 가면 나는 그 경고를 받는다.
분명히 단일 경고는 그렇게 나쁘지는 않지만 상황이 거기에서 확대 될 수 있다고 상상할 수 있습니다.
스크립트 태그를 제거하는 문제를 방지 할 수있는 방법이 있습니다.
마지막에이 작업을 수행하는 방법을이 시리즈의 선택적 비디오로 보여 드리겠습니다.
그것은 우리의 의견을 소독하는 것입니다.
익스프레스 sanitiser라는 패키지가 있다면 우리를 위해 그것을 할 것입니다.
우리는 방금 내부의 스크립트 태그를 제거 할 속성을 삭제하도록 지시합니다.
우리는 그 코드를 작성할 필요가 없습니다.
승인.
그래서 몇 가지 문제가 있지만 다시 돌아가겠습니다.
하나의 이미지.
예, 우리는 이것들을 다시 스타일링 할 것입니다.
그러나 이러한 게시물을 잘라내어 색인 페이지에서이 모든 내용을 볼 수는 없습니다.
처음 100 자까지 남겨두고 그 후에 줄임표를 써 봅시다.
그래서 문자열을 구분하십시오.
사실 아주 간단합니다.
우리는 Javascript에 대해 이야기 할 때 초기에 substring 메서드를 사용하는 것을 보았습니다.
따라서 전체 블로그 본문보다는 색인 페이지에서 본문 부분 문자열 0까지의 첫 번째 문자가 막히게됩니다.
그리고 우리는 지금 당장 괜찮은 백의 캐릭터를 원합니다.
그리고 나는 항상 이것을 잘못 이해합니다.
하위 문자열 인 하위 문자열입니다.
그것은 두 단어처럼 낙타의 경우처럼 보이지만 그렇지 않습니다.
괜찮아.
자 이제 우리가 이것을 시험 해보면 우리는 이제이 잘린 게시물을 가지고 있고 여기에 단순한 줄임표를 추가하는 것을 보게됩니다.
그래서 서브 스트링과 그 외의 점은 점으로 점을 찍었고 우리는 rebore 링크를 가지고 있습니다.
이제 우리의 쇼 페이지는 우리가 조금 볼 수있는 목적을 제공합니다.
그런 다음 더 자세히 읽고 전체 게시물을 볼 수 있습니다.
큰.
우리는이 비디오에서 많은 것을 다루었습니다.
경로에서 ID를 사용하여 요청을 얻는 방법에 대해 이야기 한 결과에 대해 이야기했습니다.
ID를 가져간 경로를 설정하고 해당 블로그가 템플릿을 렌더링 한 것을 발견했습니다.
그러나 우리는 쇼 템플릿에서 대시를 사용하는 것을 포함하여 새로운 것들에 대해서도 이야기했습니다. 등호는 실제로 코드를 실행하여 결과를 렌더링합니다.
그리고 우리는 날짜를 더 나은 형식으로 변환하는 좋은 방법 인 문자열을 보았습니다.
여전히 유연하지는 않습니다.
Moment Jap 's라는 멋진 라이브러리가있어서 원하는 형식을 정확하게 지정할 수 있습니다.
우리는 월간 슬래시와 같은 것을 원할 수도 있습니다. 우리는 월이 약식 인 곳을 원할 수도 있고, 11 월에 일요일이 아닌 한 달 전체와 전체 요일을 원할 수도 있습니다.
원하는 형식으로 매우 명시 적으로 표현하고자하는 경우 J를 훨씬 더 잘 처리 할 수있는 방법을 통해이를 수행 할 수 있습니다.
Jay Querrey 또는 다른 클라이언트 측 라이브러리처럼 설치할 수있는 간단한 라이브러리이지만 지금 당장이 라이브러리를 사용하겠습니다.
자바 스크립트에 내장.
우리는 여기서 한 줄짜리 코드 외에 다른 코드를 필요로하지 않습니다.
큰.
그리고 마지막으로 인덱스 대신 부분 문자열을 사용하는 것이 가장 좋습니다.이 뷰는 잠시 본 적이 없지만 초기에 보았습니다.
첫 번째 논의는 우리가 첫 번째 컷을 만들고 싶고 두 번째 인수는 두 번째 컷을 만들고 싶은 곳입니다.
우리는 그 사이에 모든 것을 가져갑니다.
큰.
괜찮아.