전체 글

디자이너가 기록하는 프로그래밍
요소(element)🔗https://developer.mozilla.org/ko/docs/Glossary/Element- 웹 페이지를 구성하는 개별적인 요소- 시작 태그(속성, 속성 값) + 콘텐츠 + 종료 태그로 정의- 문서 객체 모델(DOM)으로 파싱- HTML 문서나 웹 페이지를 이루는 성분 요소(element)는 웹 페이지를 구성합니다.XML과 HTML에서 요소는 데이터 항목, 텍스트 한 묶음, 이미지를 담을 수 있고, 아무것도 담지 않을 수도 있습니다.일반적인 요소(element)는 여는 태그와 몇 가지 특성, 내부의 텍스트 콘텐츠, 닫는 태그로 구성됩니다. 요소와 태그는 같지 않습니다. 태그는 소스 코드에서 요소의 시작과 끝을 표시하고, 요소는 브라우저가 페이지를 표시할 때 사용하는 문서 모..
📌 문제 상황일단 나는 TailAdmin이라는 템플릿을 사용하고 있다.사이드바에 들어가는 아이콘을 변경하고 싶은데, 기존에 있던 아이콘으로는 한계가 있다.아이콘을 더 추가해서 사용하고 싶다.     🛠️ 해결 방법나는 Next에 SVG파일을 어떻게 넣는지 모른다...🥹그래서 기존에 있던 아이콘들이 어디에서 왔는지 찾아봤다.  1. 사용된 아이콘들이 있는 폴더 찾기사이드바에 아이콘들이 사용됐으니 사이드바 페이지를 들어갔다.▼AdminSidebar.tsx이런식으로 HomeIcon처럼 아이콘을 컴포넌트로 만들어서 사용하는 것 같다.컴포넌트 출처를 따라가보자. 상단에 import한 곳을 보니 ../icons/index 라는 곳이 있다.Ctrl+클릭해서 해당 페이지로 이동했다.   ▼ src/icons/in..
회사에서 작업하던 소스를다른 컴퓨터에서 작업해야해서 소스를 가져와야함ㅇㅇ  1. VS Code열고 F1 누르기 > git clone 입력 후 실행   2. Clone From GitHub (GitHub에서 복제) 선택    3. 크롬창 열리고 github 로그인 진행함   4. 자동으로 내 프로젝트들 목록이 뜸이렇게 내 프로젝트들이 목록에 자동으로 떠있음. 누르면 됨 또는 github에서 주소 복사해서 입력하기   5. 저장할 로컬 위치 선택   6. 가져오기 성공 그래프도 잘 보임 끝
VS Code를 한국어로 변경하여 사용해 봅시다~~    1. VS Code 확장팩 Extentions (Ctrl+Shift+X) 패널에서 "한국어" 검색2. Korean Language Pack for Visual Studio Code 요거 찾아서 Install하기   3.Ctrl+Shift+P > "configure display language" 입력   4. 한국어 선택   5. Restart하면 자동으로 VS Code가 재실행되며 한국어로 보임
git으로 협업할 때 내가 일단 수정한 코드가 있음그걸 git 서버?에 올리고 싶음   1.  최신 버전 가져오기1. 제일 왼쪽 메뉴에서 소스제어 창 열기 (Ctrl+Shift+G)2. 변경내용에 마우스 올리면 git graph 볼 수 있는 아이콘 뜸. 누르셈3. git graph에서 구름모양(Fetch from Remote(s)) 눌러서 최신 버전 가져오장   2. 내가 만들거나 수정한 내용 commit하기참고로 commit은 메모같은거임.내가 뭘 수정했따~~ 이런거 다른사람들이 보고 알 수 있게 하는 메모인데규칙이 있으니까 찾아보면 나옴.수정한 파일 전부다 올릴 경우 :변경사항 오른쪽 클릭 > 모든 변경 내용 스테이징몇개만 올릴 경우 :원하는 파일 (ToDoList.tsx)에 오른쪽 클릭 > 변경 ..
1. 문제 발생tailAdmin 사용 중인데 테이블에 colspan 적용하려니까 안됨.chatGPT한테 물어봄 Next.js는 React 기반이기 때문에 일반 HTML에서처럼 table의 colspan을 그대로 사용할 수 있습니다.다만, TableCell과 같이 커스텀 컴포넌트를 사용하는 경우에는 해당 컴포넌트가 내부의 태그에 colSpan 속성을 전달하도록 구현되어 있어야 합니다.예를 들어, TableCell 컴포넌트를 아래와 같이 작성하면 colSpan 속성이 제대로 적용됩니다:   2. 해결 방법테이블 컴포넌트에 들어가봄.여기에 colSpan이라는 속성을 만들어 넣어서 전달?하도록 해야 할 것 같음// Props for TableCellinterface TableCellProps { childr..
1. Ctrl+space barComponent 같은거 복붙해서 쓰면상단에 @import 해야되잖슴~~ 이거 안하면 아래 사진처럼 빨간줄 뜸저렇게 빨간줄 떠서 심히 불-편해짐 커서를 이름 끝에다가 놓고 Ctrl+space bar 누르면뭐 가져올지 고르라고 함. 엔터치면 끝-!  상단에 TextArea 가져옴▲ 없었는데▲  생겼습니다 (9번줄)   2. Alt+Shift+O내가 사용안한 Component import 되어있어도 이렇게 빨간줄 생김불편ㅇㅇ  Alt+Shift+O 누르면 알아서 정리해줌. 헤헷
1. 문제 발생 상황Next.js로 프로젝트 작업 중,터미널에 아래와 같은 에러가 뜨면서npm run dev로 실행시킨 브라우저 화면이 안보임 (Internal Server Error)   2. 원인 및 해결방법검색 했더니 캐시가 쌓여서 발생하는 오류일 수 있다는 글을 봄..VS code에서 캐시 삭제를 해봄 VS Code에서 캐시 삭제하기npm cache clean --force    BUT 같은 문제 계속 발생함  아래 링크를 따라해봄https://ehddud100677.tistory.com/397 [오류] Error: EPERM: operation not permitted, ...제발 멈추라고!!!!!!!!!!!!!! npm install 로 모듈 최신화 및 인스톨을할때 발생할 수 있는 에러이다. ..
Git 다루는게 어려워서 일단 개발자가 알려준 순서대로 정리해보기 내가 내 로컬에서 작업을 완료했음.이제 내 코드를 메인에 합치고 싶음.  Git graph는 아래 사진과 같은 상태▼ ▼ ▼그래프 보면 뭔가 여러갈래임ㅇㅇ   1. 일단 최신 버전으로 패치하기 Fetch from Remotes 눌러서 최신 버전으로 패치하고 시작해야됨  2. 그래프가 메인에 합쳐져있을 경우에는 우클릭 checkout branch??   3. Merge into current branch아몰랑 mergr해봄 4. 왼쪽패널에 pull하라고 뜸 (몇개)  5. Date에 우클릭 > create branch  > checkout을 하고 내가 앞에 사용했던 이름 그대로 쓰기
정구미
디자이너의 개발새발 노트