취미부자

항상 내 포트폴리오만 생각하면 자꾸 바꾸고 싶고...욕심은 많아지고...이것저것 다 하고 싶은데...나중에 보면 증말 이도저도 아닌 짬뽕 + UI/UX는 개를 줘버리고이상한 포인트에 집착하고... 캬캬컄컄햐카... 또 다시 포폴 교체 뿡뿡이 왔다...🫠 ❤️혹시 누군가 이 글을 보고 있다면, 의견을 남겨주면 감사하겠습니다🙏 https://mimi-miyeon.github.io/mimispace1/ https://mimi-miyeon.github.io/mimispace1/ mimi-miyeon.github.io

이제...코딩을 시작하는 단계! 🔎공통요소들 찾기(여기도 아직 기준이 조금 불명확)반복되는 스타일들을 유틸리티 클래스 혹은 mixin에 정의하기주로 라벨, 아이콘, 폰트, 버튼, 인풋 타입/구성, 큰 덩어리/구조적인 스타일 등 🗄️Utility와 Mixin 분리(여기도 아직 기준이 조금 불명확) 아직 어떻게 분리할지 조금 헷갈리지만일단! Utility에 들어갈 스타일은 Mixin을 포함할 수 있다! 🗃️파일작성하기(단위는 되도록 4의 배수 사용) _variables.scss색상, header 높이, footer 높이, 미디어쿼리 break point 등(예. $primary: #123abc; $headerH: 64rem;) _mixin.scss폰트, 카드 스타일, 패딩값, 포지션, 플랙스..

오랜만에.. 퍼블리싱하다가...디자인이랑 퍼블리싱을 거의 동시에 작업하다 보니 css가 아쥬 쓰레기 밭이 되어가쟈나..."완료"된 페이지가 늘어날 수록 나의 J가 맘이 더 불편해지쟈나... 🥲(폰트 크기, 간격, 중복 코드 짱 많아...🙈)다행이 마지막에 조금 정리할 시간이 있어서 폰트 크기는 통일 했지만아직 만족스럽지 않아..!!! 처음부터 이런 문제 없이 깔끔하게 스타일 파일 관리할 수 있게,마지막에 쓰레기 코드를 어떻게 정리했는지 토대로 체크리스트랑 규칙을 작성해 놔야겠다! 체크리스트SCSS를 사용할 때랑 안할때 차이 딱히 없을 것 같긴 하지만, 일단 SCSS를 사용하는걸 기준으로체크리스트를 만들어서 폴더/파일 구조 세팅 해야징!✨SCSS가 특별한 세팅 없이 CSS 덜 꼬이게 해줘서 확실히..

Function return을 할 때, 항상 로 감싸서 한 개의 태그만 리턴하는 이유는, JSX를 사용하지 않은 React의 문법 때문이다. return ( Hello ); [JSX를 사용한 코드] return React.createElement( "div", //만드는 태그 {}, //속성 React.createElement("h2", {}, "Hello"), // 자식요소 React.createElement(NewExpenseItem, { expenses: expenses }) ); [JSX를 사용 안 한 코드] React.createElement(만들 태그, 속성, 자식요소) 해당 문법에서 '만들 태그'는 1개만 들어가기 때문에, JSX 문법을 사용할 때, 1개의 태그만 리턴 가능하다.

1. Javascript의 '모듈' Javascript의 작업 크기가 커지면 유지 보수를 위해 파일을 분리해서 관리하는데, 이런 분리된 파일들을 '모듈'이라고 한다. export와 import로 모듈을 불러와서 작업한다. (script 태그로 모듈을 불러오는 경우, type="modul" 속성을 필수로 넣는다.) 2. Destructuring syntax (구조분해) 객체, 배열 데이터의 각 값을 분해, 변수에 저장하는 문법이다. 배열 데이터는 위치로 판단해 변수에 값이 담기고, 객체 데이터는 key 이름으로 담긴다. const [array, example] = ["hello", "world"]; console.log(array, example); const { apple, lemon: yellow } ..

export vs export default export와 export default 모두 공통적으로 한 파일에 있는 변수, 함수를 다른 파일에서 가져다 쓰기 위해 "내보내기"를 해 준다. export 한 파일에서 여러번 사용해서 여러 개를 내보낼 수 있다. export const todo = '할일'; export const finished = '끝'; export function TodoList () { return todo; }; export default 한 파일에서 한 번만 사용하고 한 개만 내보낼 수 있다. export default function TodoList () { return todo; } export const todo = '할일'; export const finished = '끝..