Ella 프론트엔드일지

1.var , let , const 한눈에 정리하기 선언 할당 범위 var 재선언 O 재할당 O function 함수 내부 let 재선언 X 재할당 O {} 블록(중괄호 내부) const 재선언 X 재선언 X {} 블록(중괄호 내부) 2. 구체적으로 살펴보기 1) var : 재선언이 가능하다?? 먼말이지? 재선언이 가능하다는 말은 아래와 같이 변수를 선언해주는 키워드를 계속 쓸수있다는 말이다. var만 재선언 가능하고 let이나 const 는 불가능하다. var 이름 = 'kim' var 이름 = 'park' var 이름 ; var 이름; 동일하게 재선언할 때 let 과 const 는 아래와 같이 오류가 난다. 2) 선언과 할당 그림으로 한눈에 보기 3) let 은 재할당이 가능하고, const 는 재할..

부제 : 할 게 너무 많음... 회고록을 굳이 표 양식으로 쓸 필요가 있을까 싶어서 오늘 한번 표 말고 그냥 글로 적어볼 생각(그런데 담주부터는 다시 표로 정리할 생각..나같이 근본이 TMI 인 사람에게는 표가 깔끔하구나...😂) 1. 수진이가 깃헙 이슈에 WTD 폴더를 생성해줘서 앞으로 매일매일 todolist를 관리할 수 있게 되었다. 아쉬운 점은 나는 매일 아침에 계획을 세우는 편인데.. 매번 계획이 계속 바뀐다... 왜냐...? 내 생각에 2시간이면 끝날줄 알았던 일정이..생각보다 더 오래 걸릴수도 있고, 변수가 생겨서 계획을 이행하지 못해서 계획이 미뤄지기 때문이다. 데브리 구현 연습은 계속 미뤄지고있다...ㅠㅠㅠ 더보기 특히, 매덩씨 수업은 안듣고 애플선생님 만나러 가는데...매덩씨 수업이 가..

✅문제 원인 - 리액트를 설치하고 나서... HTML 태그를 집어넣으려고 하니... emmet기능 즉, 자동완성 기능이 안된다....ㅜㅜㅜㅜ 하드코딩을 무지 싫어하기 때문에 이런건 바로바로 수정해줘야한다. 아래와 같은 코딩을 일일히 자동완성도 안되는거..수작업으로 치고있던 1인 ㅠㅠㅠ ✅문제 해결 1. 비쥬얼스튜디오 코드 열어서 명령팔레트를 연다(컨트롤 + 쉬프트 + p) 2. setting.json 검색해서 사용자 설정으로 들어간다. (기본설정으로 들어가면 안됨. 읽기전용임. 무조건 사용자 설정!) 3. 아래와 같은 문구를 추가해준다 "emmet.includeLanguages": { "javascript": "javascriptreact" } 이제 emmet기능이 될것이다

✅문제 원인 리액트를 처음 설치한 닝겐... APP.js 에서 jsx문법을 적용해서 태그를 바꾸니까 자꾸 아래와 같은 WARNING 표시가 뜬다. 물론...라이브서버에서 바뀐 태그가 잘 보여서 작업하는데는 문제 없는것 같아서 안바꿔도 될것같은데 거슬림.. 아래 warning 메세지의 뜻은 logo라는 변수는 쓰이지 않고 있다. post라는 변수도 쓰이지 않고 있으니 지워라~ 대충 요런뜻이다. 이런거 자꾸 나타나서 지우고 싶음 ✅해결방법 1) 코드를 집어넣는다. 그럴땐, App.js 등 자바스크립트 파일 맨 윗 상단에 아래와 같은 코드를 집어넣는다. Warning을 출력해주는 기능을 Lint 라고 하는데 Lint를 끄는 기능이다. /* eslint-disable */ 이렇게하면 밑에처럼 성공했다고 뜬다. ..

✅position:sticky 아래 예제를 살펴보자. 이미지가 3개가 세로로 나란히 있는데, 모든 이미지를 뷰포트에서 200px 위치에서 고정시키고 싶다면, position:sticky를 써보자 스크롤이 없을땐 3장의 이미지들이 나란히 보인다. (화면 비율을 30%까지 줄여서 억지로 스크롤을 없앴다) 스크롤을 다 내렸더니 3장의 이미지가 합쳐지고 뷰포트 기준으로 위에서 200px만큼 떨어진 위치에서 고정이 되있는 걸 볼수가 있다. 바로 position:sticky 속성 때문이다. //html //css .container{ margin:200px 0; height:2000px; text-align:center; background:yellow; } .card-box{ position:sticky; top..

✅배경설명 실제 서버도 아니고 mock(가짜) 서버를 왜 만들어야할까??!? 백엔드는 개발되는데 보통 6개월이 걸리지만, 프론트는 개발하는데 2개월 정도 걸린다. 그렇다면, 백엔드단이 개발할때까지 기다릴것인가??!? 그럴순 없지!! 바로 mock 서버로 만들어서 테스트를 해봐야한다. mock 서버를 어떻게 만들것인가?? ✅바로 json-server로 짧은 시간에 mock서버를 구축해보자~~! json-server 는 아주 짧은 시간에 REST API를 구축해주는 라이브러리이다. 우선 먼저 설치해보자. 1️⃣터미널 창을 열어서 아래와 같은 내용을 입력한다(윈도우 기준) mkdir jsonserver //jsonserver 폴더 생성 cd jsonserver //jsonserver 디렉토리로 이동하기 npm..