본문 바로가기

DEVELOP

 (150)
[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..
[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..
[javascript] Swiper ie 호환 버전 확인 Swiper 5 버전 이상부터는 ie 자체가 호환이 되지 않는다. 따라서 ie 까지 크로스브라우징을 원할 경우 5 버전 미만의 swiper를 사용해야한다. unpkg 사이트를 이용하여 다운 받으면 된다. https://unpkg.com/browse/swiper@4.5.1/dist/ UNPKG - swiper Version:... unpkg.com 😊
[javascript] ES6 ie 호환 ES6 문법으로 스크립트를 짠 .js 파일은 ie에서 작동이 되지 않는다. 이때는 Babel의 힘을 빌려서 호환 작업을 해주어야한다. (해당 작업은 윈도우 운영체제 환경에서 git Bash를 사용하였습니다.) 1. node 로컬 설치 여부 확인 node -v 1-1. 설치가 되어있지 않다면, 아래 링크를 따라 안정적인 버전으로 설치 https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. npm 로컬 설치 여부 확인 (npm은 node.js 를 설치할때 자동으로 함께 설치된다.) npm -v 3. Babel 설치 Babel은 특정 버전의 script 코..

티스토리툴바