프론트 엔드 개발자를위한 마스터 스킬

채용 정보는 프런트 엔드 개발자가 찾는 내용에 따라 다릅니다. 일부 회사는 지원자가 Ruby, Git, 디자인 도구, 비디오 편집과 같은 것을 알기를 원합니다.

그러나 "핵심"기술인 프론트 엔드 개발 작업에 필요한 몇 가지 기술과 사용자의 레퍼토리 추가를 진지하게 고려해야하는 몇 가지 기술이 있습니다.

당신이 알아야 할 사항

프런트 엔드 개발자가 알고 이해할 수있는 핵심 요소를 찾아 온라인으로 구직 정보를 찾습니다. 세 가지 핵심 요소가 있습니다. 협상 불가능.

그리고 그들은:

1. HTML
2. CSS
3. 자바 스크립트 (jQuery)

이것이 바로 기본입니다. 다행스럽게도 무료 또는 저렴한 온라인 학습 플랫폼이 많이 있습니다.이 플랫폼을 사용하면 이러한 기술을 아직 모르는 경우에 배울 수 있습니다.

HTML

HTML (HyperText Markup Language)은 인터넷의 모든 웹 사이트에서 핵심적인 구성 요소입니다. 제니퍼 키린 (Jennifer Kyrnin)

"이것은 웹 페이지의 언어로, 브라우저가 웹 페이지를 렌더링하기 위해 읽는 마크 업 언어입니다."

웹 페이지는 HTML 없이는 존재할 수 없습니다.

CSS

CSS와 HTML은 함께 작동합니다: CSS는 HTML에 스타일을 추가합니다. 저는 HTML이 얼굴과 같고 CSS가 메이크업과 유사하다는 비유를 사용하고 싶습니다.

CSS는 웹 사이트를 온라인으로 만들 필요는 없지만 기본적으로 모든 온라인 사이트는 일종의 스타일링을 사용합니다.

그렇지 않으면 꽤 지루할 것입니다. 가장 최신 버전의 CSS를 사용하면 과거에는 JavaScript 또는 Flash에서만 가능했던 애니메이션 및 고급 스타일링과 같은 작업을 할 수 있습니다.

자바 스크립트

JavaScript 또는 JS는 수년 동안 급속히 발전해 왔습니다. 요즘에는 많은 목적이 있으며 프론트 엔드 또는 백엔드에서 사용할 수 있습니다.

프런트 엔드 개발과 관련하여 JS는 웹 페이지를 대화식으로 만드는 데 도움이되므로 중요합니다. 설문 조사, 퀴즈 또는 양식 제출과 같은 멋진 작업을 수행 할 수 있습니다. 요즘에는 웹 사이트를 한 차원 높은 수준으로 끌어 올리는 데 도움이되는 수많은 JS 라이브러리 온라인이 있습니다.

그러나 프런트 엔드 개발자가되기 위해서는 가장 기본적인 JS 라이브러리 인 jQuery뿐만 아니라 기본 JavaScript도 이해해야합니다.

멋진 기술

기초를 떨어 뜨린 후에, 이들은 가지고있는 것이 좋은 다른 기술이다. (프론트 엔드 개발 작업이 많이 필요합니다.)

MV * JavaScript 프레임 워크

JavaScript 프레임 워크는 코드를 구성하고 압축하는 데 도움이됩니다.

MV * (또는 MVC) 옵션이 제공되는 한, 거기에는 30 가지가 있습니다. 두 가지가 가장 인기있는 백본.js와 angular.js입니다.

의심의 여지없이 JS 프레임 워크를 배우는 것이 진정한 프런트 엔드 개발자가되는 가장 힘든 부분이지만 기술을 한 차원 높일 수있는 가장 좋은 방법입니다.

CSS 도구

위의 JavaScript 프레임 워크와 비교할 때, 아래의 CSS 도구는 비교적 배우기 쉽습니다. 찾을 수있는 3 가지 종류가 있습니다:

• 프리 컴파일러: 프리 컴파일러 (또는 전처리 기)를 사용하면 코드 정리를 통해 조직을 유지 보수하는 데 많은 이점이 있습니다. CSS를 작성하고 DRY (반복하지 말 것) 원칙을 쉽게 적용 할 수 있습니다. 인기있는 CSS 프리 컴파일러는 Sass, Less, Stylus입니다. 처음 시작하는 분은 배움에 충실하십시오.
• CSS 프레임 워크: CSS 프레임 워크는 빌트인 그리드 및 기타 CSS 구성 요소를 사용하여 워크 플로우를 최적화합니다. 인기있는 두 가지 예는 부트 스트랩과 재단입니다.
• 반응이 빠른 디자인: 요즘 사이트에는 다양한 종류의 장치가있어 모두 사이트에 적용 할 수 있어야합니다. 반응 형 디자인을 사용하면 데스크톱, 태블릿 및 스마트 폰과 같은 모든 화면 크기에서 작동하는 사이트를 구축 할 수 있습니다. 부트 스트랩 (Bootstrap) 및 파운데이션 (Foundation)과 같은 프레임 워크는 반응 형 디자인을 내장하고 있으므로, 그 중 하나를 배우면 설정됩니다.

프런트 엔드 빌드 도구

개발자는 파일 크기 최적화 및 워크 플로 효율성을 관리 할 수 ​​있어야합니다. 이러한 도구가 도움이 될 수 있습니다.

• 패키지 관리: 특히 대규모 프로젝트 나 팀과 함께 일하는 곳에서 모든 라이브러리, 자산 등을 구성하는 것은 어려울 수 있습니다. Bower와 같은 패키지 관리자를 사용하여 모든 것을 정리하고 업데이트 기록을 보관하십시오.
• Yeoman.io: 프로젝트를 지키는데 어려움을 겪는 경우가 있으니 Yeoman을 사용하여 프로젝트를 신속하게 시작하고 생산성을 유지하십시오. 명령 줄에서 실행됩니다.
• 작업 주자: 파일을 압축하고 작업 과정을 최적화하려면 명령 줄에서 실행되는 Grunt 또는 Gulp를 사용하십시오. 그들은 Sass 또는 Less 전처리 기용 컴파일러의 역할을 할 수 있으며 다른 기능을 자랑하는 다양한 플러그인을 사용할 수 있습니다.

결론

새끼를 낳는 것이 좋을 수도 있지만 시간이 지남에 따라 추가해야 할 기술로 생각하십시오. 필요한 핵심 사항은 HTML, CSS 및 JavaScript입니다.

다른 웹 기술이있는 경우 프론트 엔드와 관련이 없더라도 디자인, 비디오 편집, SEO 등과 같이 테이블에 가져와야합니다.