2020년(그리고 그 이후)에 프런트엔드 개발자가 된다는 것의 의미

프런트 엔드 개발자 의 프런트 엔드 부분이 실제로 무엇을 의미하는지 생각해 본 적이 있습니까? 한 번은 Eric Meyer(웹사이트가 존재하는 만큼이나 오랫동안 웹사이트를 구축해 온 사람)에게 초창기에 이 용어의 의미를 알고 있는지 물었고 그는 그렇다고 대답했습니다. 따라서 새로운 직함이나 직책은 아니지만 수년에 걸쳐 확실히 범위가 변경되었습니다.

"프론트 엔드"는 본질적으로 웹 브라우저를 의미합니다. 저는 스스로를 프론트엔드 개발자라고 생각하며, 저를 웹 브라우저 개발자라고 부른다면 솔직히 싫지 않을 것입니다. 그러나 그것은 아마도 인기를 얻지 못할 것입니다(그리고 웹 브라우저를 구축하는 것과 같은 종류의 소리). 프런트 엔드 개발자는 웹 브라우저와 매우 긴밀하게 작업하고 웹 브라우저에서 실행되는 코드, 특히 HTML, CSS, JavaScript 및 웹 브라우저가 사용하는 소수의 다른 언어(예: SVG와 같은 미디어 형식)를 작성합니다. 또는 더 일반적으로 설명되는 코드는 궁극적으로 브라우저가 이해하는 언어로 처리됩니다. 그것이 프론트엔드 개발자의 영역입니다!

브라우저는 단독으로 존재하지 않으며 다양한 장치에서 실행됩니다. 우리는 반응형 디자인의 시대를 통해 그것을 배웠습니다. 그리고 가장 중요한 것은 사용자가 해당 장치에서 해당 브라우저를 사용한다는 것입니다. 프론트엔드 개발자보다 사용자에게 더 가까운 사람은 없습니다. 따라서 프런트 엔드 개발자는 다양한 장치에서 실행되는 브라우저를 사용하는 사람들을 위해 코드를 작성합니다.

이렇게 방대한 사용자, 기기, 브라우저 환경을 처리하는 것 자체가 일입니다! 나는 당신이 당신의 직책에 대해 철학적으로 생각하는 것이 매일은 아니라고 생각합니다. 우리는 여기서 당신의 할아버지 Chris와 약간의 반성을 하고 있습니다.

코딩 부트캠프를 막 졸업했고 웹 사이트 구축 경험이 다소 좁고 새로운 경우 프런트 엔드 개발을 "React 물건"으로, 백엔드 개발을 "노드"로 생각하면 용서받을 수 있습니다. 물건" 또는 "파이썬 물건"이 요즘 가장 인기 있는 맛입니다. 당신도 틀리지 않았습니다. React는 일반적으로 프런트 엔드 프레임워크로 사용됩니다(말 그대로 브라우저에서 실행되는 JavaScript입니다). Node와 Python은 실제로 웹 브라우저에서 실행되지 않는 언어의 예입니다. 그들은 웹 서버(어, 컴퓨터)에서 실행되도록 만들어졌습니다.

이 분야에 잠시 머물다 보면 이러한 라이브러리, 언어, 빌드 프로세스, 심지어 웹 사이트를 구축하는 최선의 방법에 대한 전체 철학까지도 천천히 흘러가는 것을 보게 될 것입니다.

때때로 주먹을 휘두르며 과거의 실수로부터 배워야 한다고 소리치는 노인을 목격할 수도 있습니다. 특히 떠들썩한 젊은이들이 마찬가지로 높이 주먹을 휘두르며 과거는 관련 없는 맥락이며 더 이상 유용한 논점이 아니라고 선언하는 것을 목격할 수 있습니다.

아마 둘 다 맞을 겁니다. 아무도 심술궂게 굴지 않는 한 모든 것이 흐름의 일부입니다.

상황이 바뀝니다. 나는 오늘날의 많은 웹사이트가 과거의 웹사이트보다 더 복잡하다는 것이 사실임을 알게 되었습니다. 특히 큰 것들. 소셜 네트워크 및 미디어 플레이어. 여행 예약 사이트. 전자 상거래 매장. 엔지니어링 도구. 이 사이트는 큰 규모로 시작하여 더 커졌습니다. 그들은 그들을 지원하는 대규모 팀과 함께 스스로 경제입니다. 이 복잡성은 웹 기술의 변화의 원인이자 신파와 구파 사이의 마찰의 원인입니다(그렇게 간단하게 칠할 수 있다면).

기술 분야에서 일하는 많은 사람들은 본질적으로 큰 웹사이트에서 일합니다. 그래서 우리는 이 사람들로부터 가장 자주 듣습니다. 이 사람들은 도구를 만듭니다. 그들은 블로그 게시물을 작성하고, 팟캐스트를 진행하고, 강연을 합니다. 그들은 필요에 맞게 기술 자체를 변경하도록 돕습니다.

그 동안 "프론트 엔드"는 여전히 브라우저일 뿐입니다. 브라우저 언어, HTML, CSS 및 JavaScript는 여전히 핵심 기술입니다. 이러한 언어는 진화하고 브라우저 자체도 진화하지만 더 느립니다. 그들은 실리콘 밸리에서 가장 좋아하는 슬로건인 빠르게 움직이고 깨뜨리는 것과는 정반대의 행동을 합니다. 그들은 천천히 움직이며 거의 아무것도 부수지 않습니다.

프론트 엔드 개발자가 되는 것은 여전히 ​​해당 장치에서 해당 브라우저를 사용하는 사용자에 대한 관심입니다. 그들의 경험은 우리의 일입니다. 툴링은 우리가 이를 수행하는 데 도움이 되기를 바랍니다.

그러면 프론트엔드 개발자로서 어떤 일을 하고 계신가요?

• 어느 화면에서나 잘 보이도록 디자인을 실행하고 있습니다.
• 콘텐츠에 시맨틱을 적용하고 있습니다.
• 부분과 스타일을 효율적으로 재사용할 수 있도록 UI를 추상적으로 구축하고 있습니다.
• 브라우저에서 렌더링되는 항목의 접근성을 고려하고 있습니다.
• 당신은 사이트의 성능에 대해 걱정하고 있습니다. 즉, 브라우저에서 얼마나 많은 리소스를 사용하고 있는지를 다루고 있다는 의미입니다.

그것들은 근본적으로 브라우저 수준의 문제이고 그것이 바로 프런트 엔드이기 때문에 항상 사실이었고 앞으로도 그럴 것입니다.

변화하는 것은 브라우저가 점점 더 많은 작업을 할 수 있다는 것입니다. 일반적으로 브라우저 API의 기능이 향상되고 라이브러리가 더 좋아지고 컴퓨터가 더 좋아지는 등 여러 가지 이유가 있습니다. 서버에서 브라우저로 작업을 오프로드하는 것은 수년에 걸쳐 점점 더 의미가 있습니다(단일 페이지 앱!). 진자가 뒤로 흔들리고(사전 렌더링된 사이트!) 중간 지점(JAMstack!)을 찾는 것이 흥미롭긴 하지만.

요즘 프런트엔드 개발에는 다음도 포함될 수 있습니다.

• 가장 작은 구성 요소부터 전체 페이지, 최대 URL 수준까지 전체 사이트 설계
• API에서 자신의 데이터를 가져오고 표시에 필요한 데이터 조작
• 사이트의 상태를 스스로 다루기
• 사용자 상호 작용 및 입력을 통해 데이터 변경/변경 및 해당 데이터를 상태로 유지하고 API를 통해 서버로 다시 전송

그것들은 이제 브라우저에서 할 수 있는 모든 일이며, 이 늙은 개발자의 눈이 커졌습니다. 당신이 이미 해야 할 모든 일 위에 그것이 있다고 생각할 때 그것은 엄청난 책임의 건초더미입니다.

작업의 건초 더미는 수년에 걸쳐 증가하는 경향이 있지만 프런트 엔드 개발자로서 우리가 가지고 있는 안내등은 그다지 많이 변하지 않았습니다. 우리의 핵심 책임은 여전히 ​​장치에서 웹 브라우저를 사용하는 사용자를 돌보는 것입니다. 따라서 일부 데이터를 가져와야 합니다. 멋지네요. 우리는 사용자의 요구에 부응하기 위해 빠르고 의미론적이며 액세스 가능한 페이지를 구축하기 위해 서비스를 제공하고 있습니다. 그래서 우리는 디자인 시스템을 구축해야 합니다. 멋지네요. 우리는 사용자가 일관적이지 않은 난장판을 만들지 않고 진화할 수 있는 이해하기 쉬운 인터페이스를 구축하기 위해 그렇게 하고 있습니다. 그래서 우리는 익숙하지 않은 새로운 기술을 배워야 합니다. 사용자를 위해 우리 사이트를 개선하기 위해 궁극적으로 새로운 것이 있는지 확인하고 주의를 기울이는 것이 우리의 임무입니다.

행운을 빕니다!