학습 자료

웹 프론트엔드 영어 표현

웹 프론트엔드 개발은 사용자가 가장 먼저 마주하는 화면을 만드는 일입니다. 사용자 경험(UX)과 인터페이스(UI)의 완성도를 높이기 위해, 프론트엔드 개발자는 디자이너, 백엔드 개발자, 기획자 등 다양한 팀원과 긴밀하게 협업하게 됩니다.

이러한 협업 과정에서 정확하고 효율적인 영어 커뮤니케이션 능력은 점점 더 중요한 역량이 되고 있습니다. 특히 글로벌 프로젝트나 해외 취업을 준비하는 개발자에게는, 프론트엔드 분야의 기술 용어와 실무에서 자주 사용되는 영어 표현을 익히는 것이 필수입니다.

이번 수업에서는 웹 프론트엔드 개발 과정에서 자주 등장하는 실무 영어 표현들을 다양한 예시와 함께 정리해 보겠습니다.

Quiz
0 / 1

다음 문장에서 빈칸에 들어갈 가장 적절한 동사를 고르세요.

프론트엔드 개발자가 요소에 스타일을 적용할 때 일반적으로 동사 를 사용합니다.
apply
render
design
handle

학습 자료

AI 튜터

디자인

업로드

수업 노트

즐겨찾기

도움말

프론트엔드 개발자를 위한 실무 영어 표현

요소를 렌더링하다

render an element

The browser renders the DOM elements on the screen. 브라우저는 DOM 요소를 화면에 렌더링합니다.

render는 브라우저가 화면에 시각적으로 요소를 표시하는 과정을 의미합니다.

사용자 인터페이스를 설계하다

design the user interface

The designer is responsible for designing the user interface. 디자이너는 사용자 인터페이스를 설계하는 역할을 맡습니다.

user interface(UI)는 사용자가 직접 상호작용하는 화면 요소들을 의미합니다.

이벤트를 처리하다

handle an event

You can handle a click event with an event listener. 클릭 이벤트를 이벤트 리스너로 처리할 수 있습니다.

handle은 이벤트 발생 시 수행할 동작을 정의할 때 사용하는 표현입니다.

상태를 업데이트하다

update the state

The component updates the state when the user types. 사용자가 입력하면 컴포넌트가 상태를 업데이트합니다.

state는 컴포넌트의 데이터 상태를 의미하며, 프레임워크에서 자주 사용하는 용어입니다.

API 호출을 보내다

make an API call

The app makes an API call to fetch user data. 앱은 사용자 데이터를 가져오기 위해 API 호출을 보냅니다.

API call은 프론트엔드에서 백엔드로 데이터를 요청하는 작업을 의미합니다.

스타일을 적용하다

apply styles

Use CSS classes to apply styles to elements. CSS 클래스를 사용해 요소에 스타일을 적용합니다.

apply는 특정 규칙이나 속성을 요소에 적용할 때 사용하는 표현입니다.

반응형 레이아웃을 구현하다

implement a responsive layout

Use media queries to implement a responsive layout. 미디어 쿼리를 사용해 반응형 레이아웃을 구현합니다.

responsive layout은 화면 크기에 따라 레이아웃이 자동 조정되는 설계를 의미합니다.

브라우저 호환성 문제를 해결하다

resolve a browser compatibility issue

The team resolved a browser compatibility issue in Safari. 팀은 Safari에서 발생한 브라우저 호환성 문제를 해결했습니다.

resolve는 문제를 '해결하다'라는 뜻이며, compatibility issue는 다른 브라우저 간 렌더링 차이를 의미합니다.

컴포넌트를 재사용하다

reuse a component

You can reuse this button component across multiple pages. 이 버튼 컴포넌트는 여러 페이지에서 재사용할 수 있습니다.

reuse는 기존에 작성한 컴포넌트를 다른 곳에서 다시 사용하는 것을 의미합니다.