본문 바로가기

전체 글266

git 프로젝트 복제 / clone 새 프로젝트를 생성하고 깃헙에 있는 플젝을 가져올때 버전관리 없는 새로운 프로젝트에서 다운로드 받는것 npx degit choi-solyi/webpack-template-basic를 저장될경로 버전 내역까지 가져올때는 git clone 저장소이름 2021. 10. 17.
Netlify 배포 (+babel-loader, webpack mode 에러 등) 이전에 html, css만으로 배포했을때와는 설정이 조금 다르다. https://www.netlify.com/ Netlify: Develop & deploy the best web experiences in record time A powerful serverless platform with an intuitive git-based workflow. Automated deployments, shareable previews, and much more. Get started for free! www.netlify.com github 연동 후 프로젝트를 불러와서 설정에서 다음과 같이 세팅.. build command -> npm run build publish directory -> dist/ 강의와 버전이.. 2021. 10. 17.
bundler 2.bundler 이번 강의 github -> https://github.com/choi-solyi/webpack-template-basic npm init -y npm i -D webpack webpack-cli webpack-dev-server@next //package.json 에 다음 추가 "scripts": { "dev": "webpack-dev-server --mode development", "build": "webpack --mode production" }, parcel과는 다르게 webpack.config.js 파일 생성 후 구성 설정을 추가해줘야한다. @html 경로 추가 npm i -D html-webpack-plugin @static img 추가 npm i -D copy-webpack-plugin .. 2021. 10. 17.
bundler 1. parcel 이번강의 github -> https://github.com/choi-solyi/parcel-template-basic 번들러는 대표적으로 parcel과 webpack 이 있다. parcel : 단순한 자동 번들링. 소,중형 규모에 적합 webpack : 매우 꼼꼼한 구성. 중,대형 규모에 적합 프로젝트 생성 후 npm init -y @이미지 정적으로 관리하기 npm i -D parcel-bundler npm i -D parcel-plugin-static-files-copy // package.json 에 다음 추가 "staticFiles":{ "staticPath": "static" } @autoprefixer : 브라우저리스트 옵션은 현재 npm프로젝트에서 지원할 브라우저의 범위를 명시하는 용도. 그.. 2021. 10. 17.
js 기초 (데이터타입, 연산자, 조건문, 반복문, 변수 유효범위, 형변환) import getType from './getType' import rd from './getRandom' //실행문 console.log("heloworld!") console.log(123) console.log(typeof "heloworld!") console.log(typeof 123) console.log(true) console.log(typeof null) console.log(typeof undefined) console.log(typeof {}) console.log(typeof []) // function getType(data){ // return Object.prototype.toString.call(data).slice(8, -1); // } console.log("-getTy.. 2021. 10. 16.
Node.js npm 버전관리 / gitignore 유의적 버전 - SemVer 버전 -> 12.14.1 // 메이저.마이너.패치 메이저 버전이 바뀌면 이전버전과 호환이 되지 않음. 마이너 버전은 기존버전과 호환이 되지만 새로운 기능이 추가된 버전 패치버전은 버그, 오타 등이 수정된 버전 맨앞 ^ 캐럿기호가 붙어있으면 메이저버전 중에서 가장 최신 버전으로 업데이트를 허용한다는 의미 npm info lodash // lodash 의 정보 확인에서 버전 확인 가능 npm install lodash@4.17.20 //하위버전으로 변경 npm update lodash npm 프로젝트의 버전관리 버전관리를 할 필요가 없는 파일들 node_modules는 따로 관리하지 않아도 package.json 에서 가지고 있기 때문에 깃에 올리지 않아도된다. node_modu.. 2021. 10. 15.
Node.js 설치 및 실행 방법 Nodejs.org 에서 설치해준다. 가능하면 짝수버전 = 현재14 cmd nvm --version //버전확인 nvm ls //list의 약어 nvm install 12.14.1 //다운로드 nvm use 12.14.1 //버전변경 nvm uninstall 12.21.0 //삭제 nvm --help //설명 Node Package Manager == NPM npm init -y //package.json 파일이 생성됨 npm install parcel-bundler -D //parcel-bundler 라는 모듈 다운로드 폴더와 파일이 생성됨 npm install lodash // -D를 붙인것은 Dev디펜던시를 의미 = 개발용 의존성 패키지 -> 추후 웹브라우저에서 사용할 땐 필요 없음 // 안붙인것은.. 2021. 10. 15.
VSCode git 최초 설정 및 명령어 최초설정 git config --global core.autocrlf true //windows git config --global user.name 'choi-solyi' git config --global user.email 'choi-solyi@naver.com' git config --global --list //등록된 내용 확인 git 생성 및 커밋 / 푸시 git init // 현재 프로젝트에서 변경사항을 추적 (버전관리) git status //아무것도 안뜸 git add . // 마침표 = 모든 파일 git status git commit -m 'Start project' //프로젝트 생성 (메세지m과 함께 버전을 생성) 파일추가 후 git add . // 다시 모든 내용 추적하도록 명령 .. 2021. 10. 14.
VSCode 단축키 및 확장 플러그인 플러그인 --Beautify 설치 --Auto Rename Tag // 에서 하나를 변경하면 자동으로 매칭되는 태그명 변경됨 --live server --Material Icon Theme : 파일 아이콘 설정 --bracket Pair Colorizer : 괄호 색 지정 (가독성) --Path intellisense : 경로 작업시 자동으로 경로를 잡아준다. --Auto Rename Tag : 쌍으로 된 태그 자동으로 수정 --eslint : 코드 규칙 --prettier : 코드 예쁘게 --auto import : import 자동으로 안될 때 추가 eslint 설정 추가후 settings.json "editor.tabSize": 2 , "emmet.variables": { "lang": "ko" }.. 2021. 10. 14.
도로명주소 검색 API 연결 시간 초과 이전글 : https://solyi.tistory.com/158 도로명주소 검색 API UnknownHostException 발생 https://solyi.tistory.com/157 도로명주소 검색 API 사용시 발생하는 cors policy 에러 1. 도로명 주소 검색시 세션이 끊기며 로그아웃 되는 현상이 발생. - 원인은 알 수 없었지만, 도로명주소 개발자센터 solyi.kr 소스를 서버단에서 호출하는 방식으로 변경하고, 도로명주소 개발자센터에서 안내해주신대로 hosts 파일에 ip주소와 juso.go.kr을 추가했지만 여전히 도로명 주소 검색이 되지 않았다. 로그에 HostUnknownException은 사라졌지만 연결시간 초과로 Session time out 발생.... 원인이 무엇인고하니, 방.. 2021. 10. 14.
[유튜브] 한시간만에 끝내는 Vue.js 입문 배운것 vue 설치 (nodejs 설치 필수) - npm install -g @vue/cli 폴더 생성 방법 - vue create test ('test'라는 프로젝트 생성) bootstrap vue 설치 방법 data를 {{ }} 로 표시하는 방법 watch 의 기능 method (function) create, mount, update, destroy 타이밍 App.vue / main.js / router.js / Header.vue / Home.vue / About.vue 각 무슨 기능을 하는지 잘 모르겠음 데이터 바인딩 {{ }} 이벤트 @click @change 다중데이터 v-for 조건에 따라 보여주기 v-if : 렌더링 X v-show : 렌더링O 보여주진않음. Welcome to home~.. 2021. 10. 13.
네트워크 5주차 강의 - WAN 기술 지난시간 복습 현재 네트워크는 거의 별 구조로 되어 있다. 이번 시간 내용 회선 교환 회선 설정 : 단말 장치 간의 회선 설정 데이터 전송 : 전이중 방식의 연결로 데이터 전송 회선 해제 : 회선 연결의 해제 패킷 교환 정보를 일정한 크기의 블록으로 나누고, 블록마다 수신인을 붙여서 보내는 방식 회선의 사용효율이 높아 오늘날의 디지털 전송 방식에 적합한 망 WAN 기술 X.25 : 전용선으로 상호 연결된 두 개 이상의 X.25 패킷 스위치로 구성된 네트워크 프레임 릴레이 : X.25의 기본을 유지하면서 멀티미디어의 전송에서 요구되는 고속 및 신뢰적인 전송 서비스 제공 교환 Switching 다중 장치가 있을 때 어떻게 1대1로 연결할것인가 1. 서킷 스위칭 (=회선 교환) 2. 패킷 스위칭 (=패킷 교환.. 2021. 10. 13.
[error] VSCode : 이 시스템에서 스크립트를 실행할 수 없으므로 VSCode 터미널에서 vue 설치 (vue -g install vue/cli) 후 테스트 폴더를 작성하려고 했는데 에러가 발생 vue create test //테스트 폴더 생성 명령어 console 내용 : vue : 이 시스템에서 스크립트를 실행할 수 없으므로 ~~ vue.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Exe cution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. PowerShell 을 관리자 모드로 실행 get-help Set-ExecutionPolisy > [Y](조금 시간이 걸린다) Set-ExecutionPolicy RemoteSigned > [Y] 2021. 10. 13.
반응형

티스토리툴바