목록Study (23)
ez-dev-oo

* 사족이전 Git 계정에 있는 정보들을 현재 사용하는 계정에 가져오려던 깃린이는 마음대로 Add account를 눌러버렸고.. 이것저것 만지다가 깃 계정을 여러 번 날려 본 전적이 있는지라..뭔가 잘못된 줄 알고 헉..! Add account 한 계정 어떻게 없애지 없애면 계정 자체가 없어지는 거 아닌가 따흐흑 이번에도 계정 삭제 엔딩인가 괜찬하 아임파인 하다가 정신 차리고 구글링 해보니 그냥 매번 로그인 로그아웃하기 귀찮으니까 계정 add 해놓고 쉽게 사용하는 기능이었던 거임.. ^_^ ◾ 계정 추가하기Github에서 아무 페이지의 오른쪽 상단에 있는 내 프로필 사진을 누르면 메뉴가 나타난다. Add account 버튼을 누르면 로그인 창이 뜬다. 연결할 계정의 로그인 정보를 입력해주면 된다.2FA ..
* 학습을 목적으로 작성된 글입니다* 각종 피드백은 언제든지 감사히 받겠습니다 😀 함수 선언 시, function 함수명 (...)으로 정의할 때도, const 변수명 = () => { ... } 형식으로 정의할 때도 있다. 각각의 정의 방법에 대하여 더 자세히 그리고 두 방법 사이에 어떤 차이가 있는지 살펴보도록 하자!◾ 자바스크립트에서 함수 정의하기 자바스크립트(ES6)에서 함수를 정의하는 방법은 크게 일반함수와 화살표 함수 두 가지로 나눌 수 있으며, 일반함수는 Function 키워드로 함수를 정의하는 방식으로 함수 선언식(Function Declaration)과 함수 표현식(Function Expression)이 있다.두 방식은 호이스팅(Hoisting) 발생 여부에 차이가 있다. ◽ 함수..
* 학습을 목적으로 작성된 글입니다* 각종 피드백은 언제든지 감사히 받겠습니다 😀React로 웹 개발에 처음 관심을 가졌던 나로서는 .jsx 혹은 .tsx 확장자를 사용하는 것이 익숙하다. 그런데 최근 유데미에서 꽤나 오래된 강의를 듣는 중에, .jsx가 아닌 .js를 사용하는 것을 보고 두 확장자의 차이에 대해 알아보고자 한다. ◾ JSX란?JSX란, JavaScript에서 XML을 추가한 확장형 문법으로 JavaScript XML의 약어로, JavaScript 파일 내에 HTML과 유사한 마크업을 쉽게 사용할 수 있도록 돕는다 (내부적으로 XML/HTML 코드를 React.createElement() 함수를 통해 자바스크립트로 변환해준다). ◾ .js vs .jsx결론부터 말하자면 확장자로서의 차이..

* 학습을 목적으로 작성된 글입니다 * 각종 피드백은 언제든지 감사히 받겠습니다 😀 ◾ Module.css같은 클래스 이름을 가진 다른 컴포넌트들과의 충돌을 방지하기 위해 사용한다.예시와 함께 차이를 살펴보자! ◾ 적용 전 ◽ App.jsximport Button from "./Button";import "./App.css";function App() { return ( Module CSS 적용 전 Just Button );}export default App; ◽ App.css.items { display: grid; margin-top: 50px; text-align: center;}.btn { padding: 10px 20px; borde..
* 학습을 목적으로 작성된 글입니다 * 각종 피드백은 언제든지 감사히 받겠습니다 😀React 강의를 듣던 중 StrictMode를 삭제하고 프로젝트를 진행하는 것을 보며, StrictMode는 무엇이고 어떤 역할을 하며 개발에 어떤 영향을 미치는지 알아보고자 한다.◾ StrictMode란?초기 리액트 프로젝트 세팅 시 App 컴포넌트가 태그로 감싸져 있는 모습을 볼 수 있다.import React from "react";import ReactDOM from "react-dom/client";import App from "./App.jsx";ReactDOM.createRoot(document.getElementById("root")).render( ); StrictMode는 컴포넌트 내부..
* 학습을 목적으로 작성된 글입니다* 각종 피드백은 언제든지 감사히 받겠습니다 😀◾ 등장 배경순수 CSS는 단순하고 직관적이지만 작업 규모가 커질수록 가독성이 떨어지며 수정이 번거로워져 유지보수가 불편했다.이에 등장한 SASS는 변수, 함수, 계산, 중첩, 믹스인 등의 추가적인 기능을 제공하여 작업을 쉽게 해줄 뿐만 아니라 가독성과 재사용성을 높여주어 유지보수가 용이하도록 도와준다. ◾ SASS와 SCSSSASS(Syntactically Awesome StyleSheet)는 기존의 css가 가진 단점들을 보완하는 스크립트 언어로, css 메타 언어이다. (메타 언어: 어떤 언어를 설명, 정의 또는 분석하는데 사용되는 언어. 고차언어라고도 한다) SASS의 두 가지 문법이 바로 SASS와 SCSS이다. ..
* 학습을 목적으로 작성된 글입니다* 각종 피드백은 언제든지 감사히 받겠습니다 😀◾ useState란?const [state, setState] = useState(initialState) useState는 컴포넌트 내부에 새로운 State를 생성하고 관리하도록 하는 React Hook이다. 매개변수로는 state의 초기 설정값(initialState)을 가지며, 현재 상태(state)와 상태 변경 함수(setState)를 갖는 배열을 반환한다. 그리고 반환된 배열은 구조 분해 할당을 통하여 [ state, setState ] 로 지정된다. 주로 단순한 상태 관리에 사용되며, [ something, setSomething ] 과 같이 지정해주는 것이 관례이다. ◾ 구조 분해 할당이 뭔데? 구조 분해..