반응형 Svelte15 Javascript - Promise 그리고 then 과 여러 상태 JavaScript의 Promise와 .then()은 비동기 작업을 처리할 때 매우 중요한 개념입니다. 아래에 개념과 사용법을 정리해드릴게요.Promise란?Promise는 비동기 작업의 최종 완료 또는 실패를 나타내는 객체입니다. 미래에 어떤 값이 반환될 것이라는 "약속"을 의미하죠.상태 (States)Promise는 세 가지 상태를 가집니다:Pending (대기): 아직 결과가 없는 초기 상태Fulfilled (이행): 작업이 성공적으로 완료됨Rejected (거부): 작업이 실패함Promise 생성const myPromise = new Promise((resolve, reject) => { const success = true; if (success) { resolve("작업 성공!"); .. 2025. 6. 4. Svelte - VSCode Can't find stylesheet to import scss prependData 설정 문제 해결 오랫만에 Svelte 코드를 수정할 일이 있어서 파일을 열었는데 온통 붉은 빛으로 물든다... 확인해보니, Can't find stylesheet to import scss 오류와 함께, svelte.config.js에서 지정한 prependData 설정이 잘못되었다고 한다. 흠... 한참을 들여다보다가, 문제의 원인을 확인한 부분은 바로... 경로에 있다는 것을 알게 되었다. 위 경로를 보면, ./src/scss/main.scss 상대 경로로 되어 있어 실제 사용할 때에는 문제가 없지만, VSCode입장에서는 어디인지 위치 확인이 원할하지 않은 문제.. 그래도 붉은색은 개발자에게 있어서 매우 불길한 색상이기에 검색을 해본 결과 절대 경로로 설정할 수 있는 방법을 찾았는데 아래와 같다. import pa.. 2022. 12. 15. nodeJS - axios fetch 활용 nodeJS의 HTTP와 같은 네트워크 요청을 진행할때 대표적인 모듈인 axios와 fetch에 대해서 핵심적인 부분들을 알아보고자 한다. fetch 와 axios 소개 fetch는 기본적으로 대부분의 브라우저에서 내장하고 있기때문에 별도의 설치 없이 바로사용이 가능하다는 장점이 가장 크다고 할 수 있다. 그리고 가장 최신 기능들이 여기에 먼저 들어간다. 자세한 기능은 Mozila 개발자 포럼에서 확인이 가능하다. Fetch 사용하기 - Web API | MDN (mozilla.org) axios는 fetch보다 사용등에 개발 편의성을 고려해 만들어진 패키지이다. axios는 fetch보다 아래와 같은 장점을 가지고 있다. XSRF 보호 data 속성으로 object를 포함 status가 200와 sta.. 2022. 8. 13. Svelte - Snowpack dev Port 조정 devOptions 사용 개발서버의 포트를 변경하기 위해서 찾아보던중 Snowpack 옵션중 devOptions을 변경해야 하는줄 알았다. 그럼 이에 대해서 알아보고자 한다. 설정을 하지 않으면 기본으로 지정된다. module.exports = { devOptions: { port: 8080, // 개발 서버를 실행할 포트 번호 fallback: 'index.html', // SPA인 경우 제공할 모든 사용자 경로 open: 'default', // 새 브라우저 탭에 개발 서버를 열기, “chrome”, “firefox”, “brave”등 설치 경로 지정 output: 'dashboard', // 콘솔의 출력 모드를 지정, "stream" | "dashbaord", 다중 실행시 stream으로 동일한 콘솔에 내용을 출력 host.. 2022. 7. 26. Svelte - Docker + Nginx 를 이용한 배포하기 Svelte 배포시 Docker를 활용한 방법을 정리해보고자 한다. Svelte는 Build를 구성하였을때 최적화하여 Output을 만들어 주기 때문에 여기에 웹서비스를 함께 구성하면 효과적이다. 이때 함께 사용할 만한 옵션으로 Nginx가 효율성이 높다. 그럼 먼저 테스트 Application을 템플릿을 통해 구성하도록 하자. (본 작업은 만약 구성한 Svelte 앱이 없는 경우 최초에 진행하는 작업이다. 별도의 개발한 프로젝트가 있다면 생략한다.) npx degit sveltejs/template svelte_test cd svelte_test Dockerfile 생성 Dockerfile 구성은 어렵지 않다. 아래와 같이 package.json와 package-lock.json 파일을 복사한다. 그리.. 2022. 7. 25. Svelte - TinyMce images_upload_handler Error - tinymce cannot read properties of undefined (reading 'then') 아마 Svelte에서만 발생하는 문제로 보인다. images_upload_handler 를 등록하면 아래와 같은 오류와 함께 진행이 되지 않는다. tinymce cannot read properties of undefined (reading 'then') TinyMCE를 통해 이미지관련된 이벤트를 효과적으로 처리하기 위해서는 별도의 평션을 만들어 이용해야하는데, 이부분에서 분명 백엔드에서 값을 가져왔지만 정상적으로 보이지 않는 에러가 발생한다. 하지만 표시가 되어야 할 source 경로에서는 아래 처럼 read 오류가 발생한다. 처음에는 브라우저의 CORS 문제로 생각하여 브라우저를 고쳐보았다. Mac - Chrome CORS Disable 실행 (asecurity.dev) Mac - Chrome COR.. 2022. 5. 10. 이전 1 2 3 다음 반응형
