본문 바로가기

React7

img 태그 img 태그를 작성할때 alt가 없다면 아래와 같은 문구가 나오면서 노란색 밑줄이 쳐져있다 img elements must have an alt prop, either with meaningful text, or an empty string for decorative images. import logo from "./logo.png"; alt는 alt 특성은 이미지의 텍스트 설명이며 필수는 아니지만, 스크린 리더가 alt의 값을 읽어 사용자에게 이미지를 설명하므로, 접근성 차원에서 매우 유용합니다. 또한 네트워크 오류, 콘텐츠 차단, 죽은 링크 등 이미지를 표시할 수 없는 경우에도 이 속성의 값을 대신 보여줍니다. 라고 한다. 그래서 아래와 같이 이미지에 대한 설명을 넣어주면 노란색 밑줄이 없어진것을 확.. 2022. 4. 7.
AWS Amplify 새로고침 에러 ・배포된 사이트에서 route된 주소로 이동하고 새로고침을 하니깐 아래와 같은 에러가 나왔다;; 위와 같은 경우는 아래와 같이 「다시쓰기 및 리디렉션」이 없는경우이다. 대부분 자동으로 생성되는데 안될때도 있어서 아래처럼 되있을 수도 있다. 「다시쓰기 및 리디렉션」에서 「편집」을 누르고 아래와 같이 작성해준다. 404 소스주소 : / 200 소스주소 : 를 입력하고 저장을 눌러준다. 저장되면 아래처럼 생성된것을 확인할 수 있고 배포된 사이트에서 새로고침해서 확인하면 에러가 없는것을 볼 수 있다. 아래 링크에서 참고했다. https://stackoverflow.com/questions/63025997/getting-an-access-denied-error-when-i-reload-my-react-app-on.. 2022. 4. 5.
AWS Amplify에서 react deploy 해보기 1. AWS console에서 「amplify」을 검색 후 AWS Amplify 클릭하여 들어간다. 2. 1번을 진행하면 아래와 같은 화면이 나온다. 아래 화면에서 시작하기를 눌러준다. ( ※ 지역을 설정할 수 있습니다. 사진 속 우측 상단에 표시되어 있는 부분에서 설정해주세요) react를 deploy 해보려는 것이기 때문에 오른쪽 「웹 앱 호스팅」에서 시작하기를 선택해준다. 3. Amplify Hosting 시작하기 및 GitHub연결하기 깃허브를 선택하고 계속을 누르게 되면 깃허브 계정과 연동할건지 묻는 창이 나온다. 안내해주는대로 연동하는 과정을 진행하면 쉽게 연동이 가능하다. 4. 리포지토리 브랜치 추가 연동이 되었다면 계속을 눌렀을때 아래와 같은 화면이 나오고 「최근 업데이트된 리포지토리」에서.. 2022. 4. 5.