728x90 React12 React_ Refused to execute script from 'static/js/main.e0239543.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. React 에서 프로필 프로젝트를 개발하고 서버에 업로드 중 Refused to execute script from 'https://url/static/js/main.e0239543.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.이런 오류가 발생해서 만든 scss 나 컴포넌트들이 보이질 않아 흰 화면으로 남아있었다. 분명 url 접속은 잘 된듯 한데 내용물이 안나오고 저런 에러가 나오니까 뭔가 좀 이상했다.. 해당 url이 npm run build 한 폴더에서 인식을 못했기 때문에 빈 내용이 나올 수 있다 생각이 들었다. 그래서 여기 애초에 처음 시작하는 부분에서 profi.. 2024. 8. 9. React_ Semantic 구조 시멘틱 태그에 대해서 알아두면 굉장히 좋다사실 이거 하나만 알아도 실제로는 무방하다 보지만, 협업이나 여러사람들이 같이 하는 구조에서는 이러한 방법은 비효율적인 방법이다.어떤 곳에서 어떻게 쓰이는지 시각적으로 직관적으로 해야 협업이 가능하므로 알아두면 굉장히 좋다필수라고 해도 과언이 아니다https://velog.io/@oimne/%EB%A6%AC%EC%95%A1%ED%8A%B8%EC%97%90%EC%84%9C-HTML5-%EC%8B%9C%EB%A9%98%ED%8B%B1-%ED%83%9C%EA%B7%B8-%EC%A0%81%EC%9A%A9...로 " data-og-host="velog.io" data-og-source-url="https://velog.io/@oimne/%EB%A6%AC%EC%95%A1%.. 2024. 8. 7. React_ npm module @types 의 의미 보통 무의식적으로 npm i ~ 이렇게 필요한 모듈을 설치할때가 많았다.근데 구글링 해서 찾아보면 npm i --save , npm i --save -dev 이렇게 사용해서 설치하는 경우를 보았는데 뭐가 다른건지 궁금해졌다.그래서 한번 찾아보았다.밑의 사이트에서 설명을 잘 해놓은듯 하다. npm init 하여 설치할때 npm 설치를 관리를 해주는 역할이기 때문에 새로운 프로젝트를 시작하더라도 쉽게 다운받았던 모듈들을 npm install 로 받을 수 있는걸 처음 안것 같다.이렇게 좋은 시스템이였구나 ..! 다시한번 공부하는 계기가 되었다. https://garniel23.tistory.com/entry/%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0-styled-components-.. 2024. 7. 29. React_ build 시, 기본 접속 url 변경 원래는 "/" 이부분으로 기본 url 설정 되어 있어서 npm run build 시 빌드파일의 index.html 이 모두 기본 "/"으로 시작하고 있다.난 "/xxx" 이런식으로 기본 url 를 변경하고 싶었다. 여러가지의 서버파일 분리를 위한 작업을 하고 싶었다그러던 중 찾아보니 package.json 에 { "name": "your-app-name", "version": "0.1.0", "private": true, "homepage": "/badminton", "dependencies": { // your dependencies }, "scripts": { // your scripts }} 이런식으로 homepage 키워드를 넣고 설정만 해준다면 바로 npm run bui.. 2024. 7. 16. React 프로젝트 생성 feat. Typescript 처음 리액트 프로젝트 생성했을땐 그냥 npx create-app my-app 으로 진행해서 타입스크립트가 적용이 안된채로 타입스크립트 환경설정을 해주었다. 하지만 지금 새로운 프로젝트를 생성할 필요가 느껴져서 다시 찾아보려 하니 익숙했던 부분이 익숙치가 않아져서 불편했다. 그래서 이 사이트를 우선 참조했다 https://velog.io/@defaultkyle/react-with-ts-1 [Study] React _ TypeScript 적용하기 #1이번주차 스터디 공유물로 리액트에 점진적으로 TypeScript를 적용하는 방법에 대해서 알아보겠습니다. create-react-app을 이용해서 리액트 어플리케이션을 만든다면, TypeScript + React 환경을 쉽게 구축velog.io 그리고 기존에 .. 2024. 6. 13. React 무한 스크롤 리액트에서 페이징 처리를 해야하는 상황이였다...주로 앱을 작업하였기 때문에 Swift 에서는 tablecell 로 스크롤이 마지막에 닿으면 그때 쓰레드를 통한 페이징처리를 작업하였고 Java에서도 역시 recyclerview 를 이용한 페이징 처리를 진행하였다.하지만 웹에서는 어떻게 스크롤 끝을 감지하여 페이징하는지 잘 몰라서 검색해보았다.. https://velog.io/@somda/FE-React%EB%A1%9C-%EB%AC%B4%ED%95%9C-%EC%8A%A4%ED%81%AC%EB%A1%A4%EC%9D%84-%EA%B5%AC%ED%98%84%ED%95%B4%EB%B3%B4%EC%9E%90 [FE] React로 무한 스크롤을 구현해보자강아지를 무한대로 즐길 수 있게 무한 스크롤을 구현해보자. 페이.. 2024. 6. 10. 이전 1 2 다음 "이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다." 728x90
