본문 바로가기
728x90

Studying Web Development21

웹 표준, 웹 접근성이란? (웹 표준, 웹 접근성이 중요한 이유) 채용사이트의 프론트엔드 엔지니어 공고 글들을 보고 있자면 아래와 같은 말들이 채용 우대사항에 빈번하게 등장합니다. 웹 표준, 웹 접근성 지식을 보유하신 분 웹 표준, 웹 접근성에 대한 이해와 경험이 있으신 분 반응형 디자인, 웹 접근성, 웹 표준을 고려한 UI 개발 경험이 있는 분 HTML, CSS등 W3C 웹 표준규격에 대한 이해가 있으신 분 크로스브라우징, 웹 표준, 웹 접근성에 대한 이해와 경험이 있으신 분 웹 표준과 웹 접근성이 대체 무엇이길래 이렇게 기업들이 우대하고 중요하게 생각하는 걸까요? 항상 커플처럼 붙어 다니며 기업들의 채용 우대사항에 자주 등장하는 웹 표준과 웹 접근성에 대해 한번 알아보겠습니다. 👨🏻‍⚖️ 웹 표준에 대해 알아봅시다. 웹 표준이 등장한 배경, 웹 표준이 무엇을 의미하.. 2022. 6. 29.
리팩터링 2판 구매, 내 프로젝트에 적용해보기 코드스테이츠를 수료 후 팀프로젝트, 개인 토이 프로젝트를 끝내고 나름 리팩터링이라는 것을 해봤다고 생각했지만 아무래도 제가 해왔던 리팩터링이 제대로 된 리팩터링이 아니란 생각이 들었습니다. 돌이켜보면 그저 버그 해결과 새로운 기능, 요소 추가에 초점이 맞춰진 행동들이었습니다. 이런 생각이 든 김에 구매할까 말까 고민만 하던 책 리팩터링 2판을 구매하게 되었고, 읽기만 하면 공부가 잘 되지 않을 것 같아 제 개인 토이 프로젝트(코딩애플 쇼핑몰 프로젝트)에 적용시켜보며 제대로 공부해보려고 합니다. 우선 이 책에서 말하는 리팩터링의 정의는 아래와 같습니다. 리팩터링이란 겉으로 드러나는 코드의 기능(겉보기 동작)은 바꾸지 않으면서 내부 구조를 개선하는 방식으로 소프트웨어 시스템을 수정하는 과정이다. 버그가 생길.. 2022. 6. 29.
ES6에서 Arrow 함수를 언제, 왜 쓸까? ES6에서 Arrow 함수를 언제, 왜 쓸까? Arrow 함수(arrow function)를 언제, 왜 사용하는지 그 이유들을 알아봅시다. 1. 함수 본연의 기능을 아주 잘 표현하는 문법입니다. 보통 프로그래밍할 때 function 문법은 아래와 같은 이유로 많이 사용합니다. 여러가지 기능을 하는 코드를 한 단어로 묶고 싶을 때 (그리고 나중에 재사용할 때) 입출력기능을 만들 때 그리고 arrow function을 사용하면 함수 본연의 입출력기능을 아주 직관적으로 잘 표현해줍니다. let 두배만들기 = (x) => { return x * 2; }; console.log(두배만들기(4)); console.log(두배만들기(8)); arrow function을 쓰면 입출력기능이 쉽고 예쁘게 표현되는 것이 a.. 2022. 6. 22.
React의 생명 주기(라이프 사이클) 리액트는 컴포넌트 기반의 View를 중심으로 한 라이브러리입니다. 그러다보니 각각의 컴포넌트에는 라이프 사이클 즉, 컴포넌트의 생명 주기가 존재합니다. 컴포넌트의 생명은 보통 페이지에서 렌더링되기 전인 준비 과정에서 시작하여 페이지에서 사라질 때 끝이 납니다. 위의 이미지는 리액트의 생명 주기를 나타낸 화면입니다. 이미지에서 볼 수 있듯이 컴포넌트는 생성 => 업데이트 => 제거의 생명 주기를 갖고 있습니다. 그럼 이제 각각의 라이프 사이클이 무엇이고 어떻게 Class와 Hooks를 활용한 함수형 컴포넌트에서 사용하는지 알아보도록 하겠습니다. 아래 목록에서 자주 사용되는 메서드는 색으로 표시하겠습니다. 나머지는 상대적으로 덜 사용됩니다. 마운트(생성) 컴포넌트의 인스턴스가 생성되어, DOM에 삽입될 때 .. 2022. 6. 20.