개발 연습 블로그

타입스크립트를 사용하는 것은 익숙하면서도 뭔가 자꾸 에러가 툭툭 나오는 이상한 경험이다. C# 할 때 처럼 타입 지정하면 다 끝인 것 같지만 그로 인해 js에서 쓰던 문법에 약간의 변화가 생겼다. map 함수가 그런데, 이전이면 배열.map((item)=>함수 뭐시기뭐시기) 구조로 돌아갔다면 타입 스크립트에서는 배열.map((group, index)=>함수 뭐시기뭐시기) 구조로 돌려야 키 설정 문제에서 자유롭다. 후자도 js에서 쓰긴 하지만 솔직히 대부분 전자 방식 쓰잖아, 안 그래? 여하튼. 그렇게 가져온 값을 돌리는데 생각해보니 조교 별로 화면을 볼 수 있어야하지 않나 싶다. 라디오 버튼을 추가할까 생각했지만 useState와 component의 props 넘기기가 또 말썽이었다. js는 진짜 가라 ..

조교 역할의 단기알바를 하던 도중 출석 체크하는 것이 꽤나 번거로운 상황에 놓였다. 조건 1. 학생들을 3개 그룹에 나눠 각 조교가 맡는다. 2. 학생 목록은 구글 스프래드시트를 사용하지만 관련되어 현재 나의 수정 권한 등은 제한적이다. 3. 일정은 오전과 오후, 저녁으로 나뉜다. 4. 오전과 오후 일정은 둘 중 하나라도 제대로 참여했다면 출석으로 인정한다. 5. 저녁 일정은 비정기적이다. 6. 자리비움 신청을 하는 경우, 면접 같은 취직활동 외의 요소는 전부 미출석으로 구분한다. 7. 전체 일정을 절반 이상 소화할 경우 장학금을 준다. 조건만 보면 무슨 알고리즘 문제를 푸는 것 같다......여기서 2번과 6번 조건으로 인해 일일히 체크하는 것이 귀찮아지는 상황이다. 전부 기억할 수는 없으니 일단 메모..

허리 다치면 진짜 개고생이다...

타입스크립트는 기본적으로 C#이나 자바를 사용해보았다면 쉽게 적응할 수 있을 것 같다. 아래 코드는 타입스크립트가 어떻게 작동하는지 장난을 쳐보았다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 import React, { useState, ChangeEvent } from 'react'; import './App.css'; function App() { const [inputValue, setInputValue] = useState(''); const [inputType, setInputType] = useState(''); const handleChange = (event: ChangeEvent)..

리액트만으로도 개발은 할 수 있지만 취업은 못한다는 것이 나를 비롯한 주변인들의 판단이 있었다. 타입 스크립트에 대한 제대로 된 공부를 해본 적이 없지만 코딩을 C# 으로 시작했던 터라 타입 다루는 것에는 익숙하다. 타입 스크립트는 단순히 int float string 붙이는 것보다 좀 더.....많은 기능이 들어가 있는 것 같으니 천천히 서둘러서 배워놔야할 것 같다.

보호되어 있는 글입니다.

요소는 왜 요소의 자식 요소여야만 하는가? 는 목록을 나타내는 태그이다. 그리고 은 순서가 없는 목록을 나타내는 태그인데, 태그로 구성된 목록을 한데 담는 컨테이너 역할을 한다. semantic HTML의 필요성을 예시를 들어 설명해보아라. 잘 모르겠습니다.

UseRef가 필요한 상황을 예시를 들어 설명해주세요 UseRef는 리렌더링이 필요없지만 변경가능성이 있거나 확실시된 변수가 리렌더링된 후에도 값이 유지되야 할 때 사용된 HOOK을 말한다. 쉽게 말해, 겉으로 드러나지 않는 값이지만 경우에 따라 자주 바뀌는 경우에 사용할 수 있는 것이다. 예를 들어, 조건부 리렌더링이 필요한 상황, 페이지에 접속할 때 회원인지, 비회원인지, 혹은 관리자인지 등을 체크한다던지, 그런 상황에 쓰일 수 있다. Cookie의 MaxAge, Expires 옵션이 무엇인지, 설정하지 않으면 어떻게 되는지 설명해주세요. 쿠키에서 MaxAge와 Expires 모두 쿠키의 유효기간을 설정하는 옵션이다. 전자는 초 단위로, 후자는 만료 날짜를 정하는 것으로, 이것들이 설정되지 않은 쿠키..

require와 import차이점을 설명해주세요. 각각 어떤 상황에서 쓸 수 있나요? require는 CommonJS에서 사용하는 모듈을 불러오는 키워드이다. 이 경우 모듈을 호출할 때 확장자와 경로를 전부 명시해야한다. import는 ES6부터 사용하고 있는 새로윤 모듈 로드 방식이다. 다른 패키지에 있는 메소드와 변수 등을 가져오는데 쓸 수 있으며 모듈의 경로나 확장자를 따로 명시할 필요가 없다. 배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유에 대해서 설명해주세요 const는 중복 선언과 재할당이 불가능할 뿐 새로운 값을 할당하는 것은 가능한 변수 타입이다. 그러므로 배열, 객체를 const로 선언했을때, 여기에 요소나 속성을 추가할 수 있는 것이다.

this가 동작하는 원리와 용법을 아는대로 설명해주세요. 평소 코드 중에서는 어떤 부분에서 가장 큰 차이가 생기나요? 대부분의 객체지향언어에서 this는 생성한 인스턴스 객체를 지칭한다. 그러나 자바스크립트는 어디에서든 this를 사용할 수 있다. 함수와 객체의 구분이 느슨한 자바스크립트에서, this는 이 둘을 구분할 수 있는 실질적이며 유일한 기능이다. 자바스크립트에서 this는 함수를 호출할 때 함께 결정된다. 평소 코드에서 어떤 부분이 가장 큰 차이가 생기는지는 잘 모르겠다...... 브라우저 저장소에 대해 차이점을 설명해주세요.(로컬, 세션, 쿠키) 로컬 스토리지는 클라이언트의 컴퓨터에 지역적으로(로컬)하게 저장되는 방식을 말한다. 브라우저를 종료해도 로컬 스토리지에 저장된 데이터는 삭제되지 않..