Stackbit는 웹 개발을 가르칠 수 있습니다

Stackbit의 새로운 "코드"및 "콘텐츠"편집기를 본 적이 있습니까? HTML 템플릿 및 머리말 데이터 모델링 방법을 배우거나 가르치기 위해 인생에서 무엇이 더 필요한지 잘 모르겠습니다.

Jamstack 여정을 시작한 것이 약 1년 전이었더라면 좋았을 텐데요.

템플릿

확인해보세요: Ispin it up 에서 Stackbit의 newAgency theme 에서 hero 섹션의 본문 텍스트가 다음 코드로 생성되고 hero_section.html 라는 파일에 있는 것을 볼 수 있습니다.

{% assign content_is_not_empty = section.content | is_not_empty %}
{% if content_is_not_empty %}
  <div class="hero__body text-block">
    {{ section.content | markdownify }}
  </div>
{% endif %}

...내 시각적 미리보기/편집 패널에서 텍스트 위로 마우스를 가져갈 때 "코드"를 클릭하기만 하면 됩니다.

데이터 모델

또한 데이터가 다음과 같이 머리말에 저장되어 있음을 알 수 있습니다.

...
sections:
  - type: hero_section
    ...
    content: >-
      We are a brand and design practice. We work closely with you, your team to
      deliver inspiring work, which enables your organization to grow. [Let's
      talk](/contact/).
...

...내 시각적 미리보기/편집 패널에서 텍스트 위로 마우스를 가져갈 때 "콘텐츠"를 클릭하기만 하면 됩니다.

시간 절약

어떤 백엔드 코드가 어떤 프런트엔드 시각 효과를 발생시켰는지에 대한 점들을 연결하려고 노력하면서 Stackbit의 모든 테마의 Git 코드베이스를 샅샅이 뒤지며 몇 달 동안 주말을 잃었는지 말할 수 없습니다.

Gatsby React WSYIWYG CMS 친화적 마크다운

케이티 ・ 2020년 6월 22일 ・ 13분 읽기

#webdev #gatsby #jamstack #tutorial

(팁: Stackbit은 살펴볼 가치가 있는 정말 잘 설계된 테마를 작성합니다.)

"코드"또는 "컨텐츠"를 클릭하기만 하면 숙련된 웹 개발자의 작업 중 분석하고 싶은 부분(더 잘 이해하기 위해)으로 바로 이동할 수 있는 기능은 웹을 배우는 경우 매우 유용합니다. Jamstack에서 개발.

무언가를 만든 방법을 다른 사람에게 보여주고 싶을 때 교육용으로도 훌륭한 도구입니다.

정말 감명 받았어요, Stackbit. 계속 오세요.