워드 프레스 테마 구축시 워크 플로우 속도 향상

게시 됨: 2020-12-17

속도는 거의 모든 프로젝트에서 가장 중요합니다. 종종 기한이 매우 촉박하고 팀의 좋은 워크 플로가 제 시간에이를 충족하고 프로세스 전반에 걸쳐 모든 사람이 소진되지 않도록하는 유일한 방법입니다.

그러한 워크 플로우는 어떻게 생겼습니까? 배달 속도를 높이기 위해 일상 업무에 대한 몇 가지 모범 사례를 어떻게 구현할 수 있습니까? 글쎄, 우리가 그것을 조사 할 수있는 몇 가지 방법이 있습니다. 첫 번째는 다음과 같습니다.

기술 워크 플로 개선

이 부분에서는 개발자가 작업 속도를 높이기 위해 사용하는 도구를 살펴 보겠습니다. 어떤 것이 가장 잘 작동하는지 알아내는 가장 쉬운 방법은 가장 느린 프로세스를 가리키는 것입니다. 다음은-가장 정신적 인 에너지가 필요한 일입니다. 때로는 프로세스가 매우 빠르지 만 실제로 수행 할 때마다 마치 집안일처럼 느껴지고 나중에 다시 밀어 붙이는 것이 좋습니다.

제안 1 – 시작 테마 준비

DevriX의 워크 플로우에 대한 한 가지 큰 개선은 각 프로젝트를 시작하기 전에 우리가 수행하는 모든 표준 작업을 수행하고 저장소에 호스팅 한 다음 새 빌드가 올 때마다 복제하는 것입니다.

시작 테마 준비

어떻게 도움이 되나요?

  1. 매번 Gulp 설정을 할 필요가 없습니다. 모든 패키지는 즉시 사용할 수 있으며 실행되며 구성은 둘 이상의 시스템에서 테스트되었습니다.
  2. 짧은 문서가 함께 제공됩니다. 새 팀 구성원이있는 경우 대부분의 설명이 이미 설명되어 있으므로 기본 설정 작업에 대해 질문 할 필요가 없습니다.
  3. 매번 프런트 엔드의 파일 구조를 결정할 필요가 없습니다. 대부분의 프런트 엔드 팀은 1 일차부터 새로운 테마로 작업하기 때문에 매번 Sass 파일에 대한 폴더 / 파일 구조를 만들어야한다면 프로젝트 당 시간을 낭비하게됩니다.
  4. 우리는 모든 것을 일관되게 유지합니다. 이것은 또 다른 큰 힘입니다. 일반적으로 동시에 하나 이상의 프로젝트가 활성화되어 있으므로 프로젝트를 열 때 처음 찾고있는 항목을 찾을 수있는 위치를 아는 것은 시간을 크게 절약 할 수 있습니다. 모든 테마에서 동일한 구조로, 스타일, JS 파일, PHP 파일이 모두 같은 위치에 있습니다.

빌드 설정을 개선하고, 린터, 후크를 도입하고, 여기 저기에 일부 작업을 추가하거나, 자주 사용되는 도우미 기능을 추가하는 문제에 대한 더 나은 접근 방식을 찾을 때마다 시작 테마를 업데이트합니다. 빌드 설정의 변경 사항이 큰 경우 기존 프로젝트의 코드베이스도 업데이트하여이를 따릅니다.

제안 2 – 동일한 코딩 스타일 및 접근 방식 유지

이를 통해 모든 개발자는 이전 사람들이 무엇을했는지 이해할 수 있습니다. 그러나 더 많은 것이 있습니다. 레이아웃 구현에 동일한 접근 방식을 적용하면 코드베이스가 더 일관됩니다. 스타일을 오염시키는 것이 주요 회귀 문제이므로 프런트 엔드 개발자에게 특히 필요합니다.

예를 들어 Google의 HTML / CSS 코딩 스타일 가이드를 볼 수 있습니다.

Google의 HTML CSS 코딩 스타일 가이드

출처

“Entry”또는“Comment”의 이름을 지정하는 일반적인 방법 또는 .list-<name> 과 같은“목록”을 관리하는 방법은 레이아웃을 구축 할 때 취하는 표준 접근 방식 중 일부입니다.

제안 3 – 로컬 작업 설정 개선

프로젝트 사이를 빠르게 탐색하는 방법은 그 자체로 시간을 크게 절약 할 수 있습니다. 디렉토리 사이에 $cd'ing 를하는 것만으로도 하루에 30 분 정도가 쉽게 걸릴 수 있습니다. 이것은 모두 시간 낭비입니다. 대신 컴퓨터에 TMUX를 설정하고, 각 프로젝트에 대해 별도의 창을 설정하고,“Running Gulp”– 패널 1과 같이 각 작업 / 목적에 대해 별도의 패널을 설정할 수 있습니다. "테마에서 명령 실행"– 패널 2; “플러그인에서 명령 실행”– 패널 3.

또한 터미널에서 직접 코드 편집기를 열 수 있는지 확인하십시오. 아이콘에서 열고 "프로젝트 열기"등으로 이동하는 것보다 코딩에 더 빠르게 액세스 할 수있는 방법입니다. VS Code는 설정이 정말 쉽습니다.

도구를 더 잘 활용하십시오

  • VS 코드, Sublime 텍스트 및 기타 여러 도구에는 편집기가 수행 할 수있는 거의 모든 것을 입력 할 수있는 "명령"팝업이 있습니다. 열려있는 모든 문서를 저장 하시겠습니까? 버튼 몇 개만 있으면됩니다. 닫으시겠습니까? 모두 같은.
  • 명령 팔레트를 탐색하십시오. 사이드 바에서 파일을 찾아 보는 것도 너무 많은 시간이 걸립니다. 계속해서 필요한 파일 이름을 작성하십시오. 파일 이름 변경, 이동, 복제 및 삭제와 같은 일반적인 작업의 속도를 높이기 위해 일부 확장을 추가합니다.
  • 린터를 설치하십시오. 파일 포맷에 시간을 낭비하는 것은 당신을 위해 할 수있는 도구가 있다면 불필요합니다. 코드를 들여 쓸 때마다 괄호 사이에 공백을 추가하면 문제 해결에 더 유용 할 수 있습니다.
  • 바로 가기 및 스 니펫 활용 – 프론트 엔드 개발자의 경우 Emmet은 생명의 은인입니다. 다음과 같은 간단한 한 줄짜리 코드 : nav>.site-nav>ul.list-items>li.list-item*5>a{title} 은 모두 형식이 지정되고 스타일을 지정할 준비가 된 15 줄 이상의 HTMl 코드로 확장됩니다. 해당 줄을 입력하는 데 몇 초가 걸립니다.
VSCode의 예

VSCode 명령 팔레트의 예. 개요 페이지에서 더 많은 것을 읽을 수 있습니다.

워크 플로우 개선을위한 의사 결정

이것은 약간 까다로울 수 있으며 클라이언트의 비즈니스 요구에 대한 더 많은 경험과 이해가 필요할 수 있습니다. 또한 책임이 더 많은 접근 방식 중 하나이지만 때로는 프로젝트가 마감일을 놓치는 것을 막을 수 있습니다.

가장 중요하고 가장 빠른 구현부터 시작하십시오. 페이지가 1 일에 시작되지 않을 가능성이 약간있는 경우 페이지를 시작할 필요가 없습니다. 예상치에 따라 준비되지 않은 것이있을 수있는 경우 고객과 논의하십시오. 수행 한 작업, 지연 될 수있는 작업 및 문제가 발생할 수있는 위치를 더 명확하게 말할수록 잠재적 인 문제를 극복 할 가능성이 높아집니다.

작업을 초기에 위임하되 관련된 총 인원 수를 낮게 유지하십시오. 이것은 모든 사람이 특정 단계에서 알아 차리는 것입니다. 아마도 가장 이른시기는 10 명의 아이들이 프로젝트에 참여할 수있는 학교에 있지만 두세 명만이 대부분의 일을합니다.

이것은 특히 더 많은 프런트 엔드 작업으로 시작하는 프로젝트에서 볼 수 있습니다. 드물게 첫날부터 두 명 이상의 개발자가 작업 할 수 있습니다. 첫 번째로 내려야하는 것 중 하나가 프로젝트의 아키텍처이기 때문입니다. 디자인 팀의 기본 결정은 빌드 여야합니다. 구성 요소, 확장 방법, 파일 분리, 미디어 쿼리 구조 및 규칙, 명명 규칙 이 모든 것.

작업 완료

그리고 그러한 기본 단계에 한 명 이상의 개발자가있을 때 두 사람 모두 사이트의 나머지 부분을 스타일링하는 데 필요한 기본 코드를 구현하기 시작할 수 있습니다. 해당 코드를 푸시하면 충돌이 발생하고 개발자 중 한 명이 대부분의 작업을 다시 수행해야 할 수 있습니다.

더 많은 프런트 엔드 개발자를 추가 할 수있는 좋은시기는 더 많은 기본 작업이 수행되고 작업을 "콘텐츠 카드", "방문 페이지 X"또는 "404 페이지"등과 같은 별도의 구성 요소에 위임 할 수있는 경우입니다. 그때까지 글꼴이 적용되고 일반적인 타이포그래피 설정이 설정되고 대부분의 파일이 생성되고 최소 1-2 페이지가 생성됩니다.

그런 다음 단일 프로젝트에 집중하는 총 사람 수를 최소한으로 유지하는 것이 이상적입니다. 시간 관리 및 작업에 집중하는 측면에서 팀에서 작업하는 개발자가 고려할 수있는 팁은 주어진 프로젝트의 작업 부하를 전환하는 것입니다.

2 주 동안 풀 타임으로 새 사이트에서 작업 한 프런트 엔드 개발자 John이 있다고 가정 해 보겠습니다. 그때까지 그는 하루에 80 시간 이상 그것을보고 있었다. 그는 사이트에서 문제 발견을 중단했을 가능성이 큽니다! 지금은 그의 친구 인 Kate가 자신의 작업 대부분을 맡아서 맡을 수있는 좋은 시간입니다. Kate는 사소한 문제를 고치기 시작하고, 디자인을 따르는 지 다시 확인하고, 여기저기서 성능을 개선하고, John이 정신 에너지가 없기 때문에 연기 한 몇 페이지와 구성 요소를 마무리 할 수 ​​있습니다.

대부분의 개발자가 이것을 경험했을 가능성이 높으며 새로운 새 프로젝트 또는 오래된 웹 사이트의 유지 관리 작업으로 마음을 조금 비우는 동안 1 ~ 2 주 동안 작업을 수행 할 수있는 팀원이 있다는 것은 매우 기분이 좋습니다. .

요약하자면:

사이트의 개발 속도를 향상시키는 몇 가지 명백한 기술적 방법이 있습니다. 팀워크가 혼합 된 것입니다. 팀에서 공통 지침을 정의하는 방법과 작업 환경을 설정하는 방법 / 작업을 자동화하는 방법과 원하는대로 모든 도구를 활용하는 방법입니다. 첫날의 높은 생산성을 유지하기 위해 더 오랜 기간 동안 마음을 신선하고 예리하게 유지하는 방법.

이 모든 것을 관리하기 위해 강력한 팀은 아키텍처를 배치 할 훌륭한 수석 개발자, 지침을 따르고 양질의 작업을 생성 할 책임있는 개발자, 모든 사람의 정신 상태를 찾을 수있는 훌륭한 프로젝트 관리자가 필요합니다.