프론트엔드개발자 6

Programmers 문제 풀이 26

문제 설명 : OX퀴즈 덧셈, 뺄셈 수식들이 'X [연산자] Y = Z' 형태로 들어있는 문자열 배열 quiz가 매개변수로 주어진다. 수식이 옳다면 "O"를 틀리다면 "X"를 순서대로 담은 배열을 return하는 solution함수??? 제한사항 연산 기호와 숫자 사이는 항상 하나의 공백이 존재한다. 단 음수를 표시하는 마이너스 기호와 숫자 사이에는 공백이 존재하지 않는다. 1 ≤ quiz의 길이 ≤ 10 X, Y, Z는 각각 0부터 9까지 숫자로 이루어진 정수를 의미하며, 각 숫자의 맨 앞에 마이너스 기호가 하나 있을 수 있고 이는 음수를 의미한다. X, Y, Z는 0을 제외하고는 0으로 시작하지 않는다. -10,000 ≤ X, Y ≤ 10,000 -20,000 ≤ Z ≤ 20,000 [연산자]는 +와..

Programmers 2023.06.22

팀프로젝트 3주차 회고

드디어 가계부를 마무리했다! 중간중간에 변경 사항이 좀 있어서 계속 바꾸다 보니 엄청 밀려서 끝냈다 그리고 계속 Prop으로 넘기고 넘기다 보니 여러 개의 기능을 같이 쓰는 페이지를 만들 때 헷갈리고 오류가 자꾸 생겨서 힘들어하다가 아... recoil 사용하기로 했지? recoil로 전역상태관리하기로 했던 게 뒤늦게야 생각이 나서 그때부터는 술술 풀렸다. 그 대신 리코일은 지금 한창 쓰려고 노력하는 중이라 useRecoilState 코드가 많아졌다. 아직 조금 서툴러서 그런가 보다 하고 넘기려 함 차차 나아지겠지. 4주 차 때 리팩토링 하면서 정리할 거니 되었다. 그리고 이번에 react-datepicker라는 라이브러리 써봤다. 처음에는 조금 어려웠지만 https://reactdatepicker.co..

useEffect.. 일단 감사합니다.

나는 Recoil State사용하면서 페이지 밖으로 나갔다 다시 돌아오면 값이 초기화되어있는 그런 값을 원했고 찾다가 때마침 오늘 멘토링하는 날이라 멘토님께 여쭤보니 useEffect에 넣으라 하셨죠... 그러네요 글로쓰면 그냥 진짜 생각이 바로 나는데 나는 설계도 안 하고 만드는 사람이었어요 와... 이래서 설계가 필요한거구나.... useEffect(() => { getUseData(); setIsSubmit(false); setFilterForm(false); setCategoryList([]); setStartDate(new Date(new Date().getFullYear(), new Date().getMonth(), 1)); setEndDate(new Date()); }, [setFilterF..

HTML5 시맨틱 태그와 웹 표준을 지키는 이유

시맨틱 태그(Semantic Tag) 내용에 대해 아무것도 알려주지 않는 태그나 태그 등과는 다르게 시맨틱 태그는 웹 페이지 내의 내용에 의미와 콘텍스트를 제공하는 HTML 태그입니다. 즉, 페이지에 내용을 표시하는 '방법'을 지정하는 것이 아닌 내용의 '목적'이나 '의미'를 설명하도록 설계된 것이죠 주로 쓰는 시맨틱 요소 정리 : 웹 페이지의 헤더 섹션을 정의할 때 사용합니다. 일반적으로 제목이나 로고 머리말 같은 요소들이 들어갑니다. : 웹 페이지의 탐색 섹션을 정의할 때 사용합니다. 동일한 사이트 안의 문서나 다른 사이트의 문서로 연결하는 링크들이 들어갑니다. : 블로그 게시물 또는 뉴스 기사와 같은 웹 페이지 내에 포함된 콘텐츠를 정의하는 데 사용됩니다. : 웹 페이지 내에서 내용 섹션을 정의하는..

TIL 2023.04.21

Font Preload

폰트를 로컬적용 하는 법 폰트를 다운로드하여서 css 파일에 적용하면 끝입니다. 간단하죠? css 파일에 font-face로 적용하면 됩니다. 저는 Nanum Pen Script를 다운로드하였기 때문에 NanumScript로 적용시켜볼게요. @font-face { font-family: 'Nanum Pen Script'; src: local('NanumPenScript'), url('./font/Nanum_Pen_Script/NanumPenScript-Regular.ttf') format('truetype'); //너무길어서 보기좋게 줄바꾸겠습니다 } @font-face { font-family: " 글꼴이름" ==> 이름은 마음대로 설정가능 하지만 나중에 혼란을 줄 수 있기 때문에 같은 폰트와 같은 이..

TIL 2023.04.03

JS ) 스코프

스코프는 변수의 유효 범위 즉 변수에 접근할 수 있는 범위를 말합니다. 동일한 식별자 충돌을 방지하기 위해 있는 거죠 변수나 함수 선언 위치에 따라 스코프를 구분할 수 있는데요 스코프에는 전역 스코프 (global scope)와 지역 스코프(local scope)가 있는데요. 지역 스코프는 또 함수레벨 스코프와 블록레벨 스코프로 나눠져요 함수레벨 스코프는 함수에서만 가져다 쓸 수 있고 블록레벨은 블록에서만 가져다 쓸 수 있죠 여기서 블록은 {}중괄호 안을 얘기합니다. var str_v = "전역 스코프" let str_l = "전역 스코프" const str_c = "전역 스코프" function fncScope() { console.log(str_v) // Output : 전역스코프 console.lo..

728x90