듀의 자료저장소

express --ejs first-project 위 명령어를 입력했더니, 스크립트를 실행할수 없다는 오류가 떴다. 원인을 찾아보니, 보안상의 이유로 window powershell에서 script를 막아놨다. (다른 터미널은 괜찮다.) express : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\Administrator\AppData \Roaming\npm\express.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Po licies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + express --ejs first-project + ~~~~~~~ + CategoryInfo ..

IT 공부/백엔드(Back-end) 2021. 12. 28. 07:34

서버 올린 파일을 삭제하고, 새 파일에서 port 3000 서버를 구동했더니 이런 에러가 생겼다. Node js에서 address already in use 문구를 발견했을 때 간단하게 해결하는 법! 터미널을 변경하는 방법으로 해결된다. node:events:368 throw er; // Unhandled 'error' event ^ Error: listen EADDRINUSE: address already in use :::3000 at Server.setupListenHandle [as _listen2] (node:net:1334:16) at listenInCluster (node:net:1382:12) at Server.listen (node:net:1469:7) at Object. (C:\User..

IT 공부/백엔드(Back-end) 2021. 12. 28. 05:19

1. label 태그의 역할: - input태그와 함께 사용했을 때, 영역이 좁다는 단점을 극복할 수 있다. (클릭 영역이 넓어진다. ex: 체크박스 선택시 input 태그가 체크되어, 선택 영역이 넓어진다.) -label태그가 input 태그를 제어할 수 있도록 돕는다. 2. label 태그와 함께 쓰는 for 속성 "for에 들어가는 value와 id"를 연결해준다. (label 태그 내부의 영역을 선택하면, for 속성이 지정된 "box-itme"인 id값을 찾는다.) => 클릭 영역이 넓어지는 이유. 버튼 영역 뿐만 아니라, 텍스트 영역까지 포함되어서 클릭이 가능하다! → 그래서 for, id는 이름을 같게 써준다. 3. label 태그 예제 (input) 핸드폰을 선택하는 입력 form을 만들고..

IT 공부/프론트엔드(Front-end) 2021. 12. 26. 21:50

Administrator@JY-20190418VQXN MINGW64 ~/Desktop/githubPractice (main) $ git push -u origin main To https://github.com/Seony-95/githubPractice.git ! [rejected] main -> main (fetch first) error: failed to push some refs to 'https://github.com/Seony-95/githubPractice.git' hint: Updates were rejected because the remote contains work that you do hint: not have locally. This is usually caused by anoth..

IT 공부/작업관리 툴(git,notion...) 2021. 12. 24. 14:02

실무에서 에러가 났을 때 대응하는 법 위에 code들만 해도, 깃허브 서버는 api 서버다. 인프런 이미지처럼, 실시간으로 바뀌는 image들은 모두 cdn 서버에서 가져온 것이다. ** cdn 서버란? 회사 들어가면 server가 여러개다. 이미지를 서빙하는 서버도 따로 있는데 cdn(콘텐츠 전송 네트워크) 서버를 이용한다. 이미지 서버가 다운됐다면? cdn문제로 홈페이지가 깨지거나 다운되는 일이 종종 있다. cdn 서버가 다운되어도, 사이트의 페이지는 그대로 나와야 한다. 이미지 서버가 뻗으면? 서버에서 전송되는 이미지만 안 나온다. 미리 설정해둔 default 이미지는 나온다. throw에서 에러가 나면 바로 catch로 가게 된다. ( 서버에서 에러 표시 ) 실제 사이트에서는 이미지를 대체이미지로..

IT 공부/프론트엔드(Front-end) 2021. 12. 14. 16:20

Promise.all([ new Promise(resolve => setTimeout(() => resolve(1), 3000)), // 1 new Promise(resolve => setTimeout(() => resolve(2), 2000)), // 2 new Promise(resolve => setTimeout(() => resolve(3), 1000)) // 3 ]).then(alert); // 프라미스 전체가 처리되면 1, 2, 3이 반환됩니다. 각 프라미스는 배열을 구성하는 요소가 됩니다. Promise.all 여러가지 promise를 한꺼번에 실행시켜준다. 하나라도 거부되면 에러가 나면서 전체를 거절한다. (모 아니면 도인 상황일 때 유용하다.) ex) 여러 개의 url에 동시에 reques..

IT 공부/프론트엔드(Front-end) 2021. 12. 13. 08:54

// 모던자바스크립트 // 정리 전 loadScript('1.js', function(error, script) { if (error) { handleError(error); } else { // ... loadScript('2.js', function(error, script) { if (error) { handleError(error); } else { // ... loadScript('3.js', function(error, script) { if (error) { handleError(error); } else { // 모든 스크립트가 로딩된 후, 실행 흐름이 이어집니다. (*) } }); } }) } }); 콜백지옥(callback hell)이란, 콜백함수를 이용해서 비동기처리를 해주다가 코드 ..

IT 공부/프론트엔드(Front-end) 2021. 12. 12. 11:55

셀렉트박스 커스텀(select box custom) 실습을 해보았다. 코드 리뷰하면서 분석해본다음에 스스로 다시 한번 써볼 예정이다. 완성본은 일단 아래와 같이 생겼다. See the Pen Untitled by 듀 (@jgvoseid-the-styleful) on CodePen. h2 { margin: 30px; } .cont-select { width: 200px; } 피그마 수치대로, article 전부에 width: 200px 값을 주었다. 버튼 넓이 자체는 반응형으로 늘어나지 않아도 되니까 고정값인 px을 준다. 셀렉트박스 커스텀(select box custom)할 때, 디자이너 분이 피그마 수치를 준다는 가정 하에 진행했다. .btn-select { width: 100%; /* 위에 부여한 2..

IT 공부/프로젝트(project, 부트캠프 및 협업) 2021. 11. 30. 08:44