프론트엔드 리액트 개발자 링크 모음

자바스크립트 : 문서 (every, reduce 이런거 보러갈때 유데미에서 사용함) https://developer.mozilla.org/en-US/docs/Web/JavaScript 유데미 : 자료구조, 리액트 등 관심있는 강의를 가끔 할인가에 구매해서 평생소장 가능 https://www.udemy.com/   리액트 https://react.dev/ 리덕스 https://redux.js.org/ 리덕스 툴킷 https://redux-toolkit.js.org/tutorials/quick-start 리액트 : 이 분 설명 핵심을 재미있게 설명 https://www.youtube.com/@cosdensolutions 뭔가 정리 잘되어 있는 리액트 문서 https://www.w3schools.com/react/react_class.asp   Mui : UI & UX https://mui.com/material-ui/getting-started/ CoreUI … Read more

useRef에 대해 ChatGPT 답변

상사가 쓴 코드에 useRef 가 있는데 읽단 긁어서 ScrollDownButton을 만들었지만, 원리에 대한 이해가 제대로 되지 않았다. 그래서 ChatGPT에게 묻고 받은 답변! 어떻게 보면 개발자에게 이만큼 좋은 친구이자 선생님인 ChatGPT   useRef는 React에서 함수 컴포넌트에서 DOM 요소에 접근하거나 특정 값을 유지하는 데 사용되는 Hook입니다. 여러 이유로 useRef를 사용할 수 있습니다: DOM 요소에 접근: useRef를 사용하면 함수 … Read more

Vue 개발 환경 설정 완료

Vue Hello World!

어쩌다 Vue.. 물론 Node.js와 React와 Redux도 소화하기 좀 바쁘지만.. 마침 면접을 보는 곳이 Vue를 써서 알아두면 좋겠다 싶어서 개발환경을 설치 했다. (기술 면접에서 떨어졌지만 나에게 남은 것은 Vue와 업데이트된 포트폴리오 ㅋㅋㅋ예쓰!) 코딩애플에서 프론트엔드 풀강의를 지른 것을 매우 잘했다고 생각한다. 그 강의를 통해서 React, ES6, JS, git에 지금의 Vue도 정말 많은 것을 누리고 있음. 정말 아깝지 … Read more

유데미 알고리즘 1회독 완강을 자축하며

유데미 알고리즘 1회독 완강

    유데미 알고리즘 1회독 완강을 자축하며 다짐과 글을 올립니다. 하루에 한 강씩 듣자! 를 목표로 한 달내 1회독 완주를 목표를 하였고 목표에 달성하였습니다! 짝짝짝! 이 분야에서 느려도 제 속도대로 규칙적으로 꾸준히하는 것을 참 잘하는것 같습니다. 이런 나를 칭찬해~ㅎㅎ 유데미 알고리즘 강의 링크 첨부 https://www.udemy.com/course/coding-interview-bootcamp-algorithms-and-data-structure/learn/lecture/8547236?start=15#content 유데미 알고리즘 강의를 들으면서 즐거웠던 점 영어로 강의를 들으니 신선하고 … Read more

웹사이트를 Figma로 전환 후 반응형 웹페이지 클론 코딩

[9월 1일 금요일 ~ 9월 4일 월요일까지 과제] 여태까지 배운 기술 (반응형, 레이아웃, css, position, flex) 등을 활용하여 선생님 웹페이지 각자 클론 코딩 과제 진행 중~ 작업 순서는 다음과 같다.   [웹사이트를 Figma로 전환하기!!] 나의 계정 Figma로 들어가서 resource button – Plugin 누르기 html to design 플러그인 설치 주의 사항 한 달에 10번만 사용 가능 … Read more

반응형과 미디어 쿼리

반응형웹

html에 들어가 있는 이 부분이 반응형의 시작 <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> content=”width=device-width 디바이스의 너비에 맞춰서 css를 넣어줘라 디바이스 사이즈 링크 https://yesviz.com/viewport/ [미디어 쿼리 구문] 미디어 쿼리란? 어떤 특정 사이즈에서 이렇게 하고 싶다 라고 하는 것임 //0 ~ 720px 까지 @media screen and (max-width : 720px) {   body {background-color: red;} } => @charset ‘utf-8’ 처럼 … Read more

Figma & CSS 모듈화 작업

button

[CSS 모듈화] Figma에서 부터 자주쓰는 버튼, 상단탭 등을 분리시켜 모듈화 한다. 만약 되어 있지 않다면 프론트엔드 개발자가 공통된 부분을 위의 그림과 같이 분리 시킨다. 이 것을 바탕으로 프론트엔드 엔지니어는 하단의 순서로 CSS를 분리한다. 초기셋업 1. 파일 셋업 2. 상속시킬 서체, 글씨크기, 줄간격 : 글뭉치 것을 사용하면 됨 3. 디자이너들이 쓰는 색 토큰 등록 javascript window … Read more

잡아라어플라이 경기도일자리재단 자바스크립트 활용 첫째 주

잡아라어플라이

잡아라어플라이 경기도일자리재단 자바스크립트 활용과정을 8월 21일 월요일 부터 시작했습니다. 11월 9일에 수료되는 과정입니다. 올해 안에 알고리즘, node.js, React, Javascript 포함하여 꼼꼼히 리뷰하고 프로젝트 진행해서 꼭 취업할 수 있도록 Figma 부터 반응형까지 탄탄히 준비하도록 하겠습니다. 하단은 제가 지원할때 사용하였던 잡아라어플라이 웹사이트입니다. https://apply.jobaba.net/bsns/bsnsDetailView.do?bsnsSeq=2384 알게 된 경로는? 국민취업제도 관계자로부터 서울시에 주관하는 강동구 일자리 교육과 취업 과정이 있다고 안내를 … Read more