본문 바로가기

분류 전체보기

 (244)
[Linux] 리눅스 명령어 살펴보기(폴더 및 파일 관련) mkdir : make directory의 약자로 새로운 디렉토리를 만들 때 사용하는 리눅스 명령어. 리눅스를 기반으로 한 쉘 스크립트를 기본적으로 bash에서는 사용한다. ls : 리눅스의 기본 명령어로 해당 디렉터에 있는 내용을 출력 ls -a : 숨김파일을 포함한 경로안의 모든 파일과 디렉토리 표시해준다. ls -l : 지정된 디렉토리의 내용을 자세히 출력 ls -d : 지정된 디렉토리의 정보 출력 ls -n : 파일 및 디렉토리 정보 출력시 UID, GID를 사용 ls -F : 파일 형식을 알리는 문자를 각 파일 뒤에 추가 ("*", "/", "@", "|", "=", "NULL") ls -R : 하위 경로와 그 안에 있는 모든 파일들도 같이 나열 ls -t : 파일 수정 시간순으로 정렬 cd :..
[Github] GitHub Pages 서비스 이용하기 무료로 앱을 배포할 수 있는 GitHub Pages. React 관련 서적을 보다가 알게되었다. (React 기반의 앱으로 GitHub Pages를 만들었다.) 1. package.json 파일 값 추가 { "scripts": { ... "predeploy" : "npm run build", "deploy" : "gh-pages -d build" }, "browserslist" : { ... }, "homepage" : "https://깃허브계정이름.github.io/저장소이름" } 2. 최종 깃허브에 업로드 git add . git commit -m "최종 반영" git pull origin main git push origin main 3. gh-page 설치 npm install gh-pages 4..
[publishing] viewport 반응형 설정 매번 코딩할때마다 저번 프로젝트 사이트를 들어가서 복사하느라 번거로워 기록용으로 남긴다.
[React.js] 컴포넌트 종류 컴포넌트란? 하나의 블록이고, 리액트 앱은 컴포넌트로 구성된다. 종류 함수형 컴포넌트 : return문으로 JSX를 반환한다. import React from 'react'; function App(){ return( Hello ); } export default App; 클래스형 컴포넌트 : render()함수로 JSX를 반환한다. 조건 및 특징 리액트 컴포넌트 클래스를 반드시 상속 받아야한다. state(동적 데이터를 다루는 객체)를 사용하기 위해서 필요한 컴포넌트 import React from 'react'; class App extends React.Component { state = { isLoading: true, } render(){ const { isLoading } = this.stat..
[Javascript] async와 await json 호출을 할때 여러가지 방법이 있다. 그중에 네트워크를 통해 데이터를 불러오는 axios 방법이 있는데, axios는 네트워크를 사용하기 때문에 느리게 동작한다. 따라서 싱글 스레드인 Javascript는 해당 json이 다 불러와질 때까지 기다리느라 다른 작업을 하지 못한다. 이 때 async와 await를 사용하여 Javascript에게 해당 json를 불러오는 함수는 비동기(다른 작업을 동시에 할 수 있는) 함수라는 것을 인지해주고, 비동기 작업의 대상 앞에 await를 붙여주어서 이 함수 실행이 끝날 때까지 시간이 걸릴 수 있다고 알려줘야한다. 예시) getMovies = async () => { const movies = await axios.get('불러올 json url 파일'); c..
[VSCode] Tab 간격 설정 해둔데로 유지하기 프로젝트마다 Tab 간격 설정이 달라서 매번 우측 하단에 Tab Size 혹은 Sapcing을 변경해줘도 창을 닫고 다시 vscode를 실행하면 다르게 설정 값이 매겨진다. 한번 설정 해둔데로 유지하고 싶다면, 1. 좌측 하단 톱니바퀴(또는 File > Preferences > Settings) 2. editor tab 검색 3. Detect Indentation 체크가 되어있다면 아래 캡처본처럼 해제 4. Editor Tab Size를 설정해주고 재실행한다. 😊
[icon fonts] 웹 아이콘 폰트 사이트 소개 매번 디자인으로 아이콘을 뽑아 사용하기 번거롭다. 따라서 웹 아이콘 폰트를 활용하여 디자인하면 훨씬 시간이 절약되고 좋다. https://ionic.io/ionicons Ionicons: The premium icon pack for Ionic Framework Ionicons is an open-sourced and MIT licensed icon pack. ionic.io https://material.io/design/interaction/gestures.html#properties Material Design Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code..
[css] 반응형 table 대응 반응형 테이블은 태그를 사용하여 퍼블리싱하기 어렵다. 를 사용하여 퍼블리싱하면 훨씬 수훨하다. HTML 번호 카테고리 제목 첨부파일 작성일 상태 공지 카테고리 비밀 공지사항 제목입니다. 홍길동 2022.01.01 대기 공지 카테고리 비밀 공지사항 제목입니다. 홍길동 2022.01.01 대기 CSS .board-list-title, .board-list-inner { display: table; table-layout: fixed; overflow: hidden; width: 100%; } .board-list-title { border-top: 1px solid #000; border-bottom: 1px solid #e0e0e0; } .board-list-title > li { display: tabl..

티스토리툴바