반응형 웹개발정보12 노션 포트폴리오 https://valiant-eustoma-bc0.notion.site/ba90f933755f4aa8b7ff7bd7bab71884 2022. 7. 25. 파비콘 만들어주는 사이트 (favicon) https://www.favicon.cc/ favicon.ico Generator Preview Favicon in original size: www.favicon.cc 브라우저 상단의 이러한 이모티콘? 느낌의 그림들을 파비콘이라고 한다. 해당 파일을 만들어주는 사이트다. 직접 도트를 찍어서 만들 수 도 있고 그림파일을 업로드해 변환시켜서 만들어 주기도 한다. 유용하게 사용하고있다. 사용방법도 매우쉽고 당연히 무료! 유용하게 쓰고있다. 2022. 4. 2. 폴더 내 파일명 리스트 추출해서 변수로 쓰기(수백개) 후.... 정말 미친일이 벌어졌다. 이렇게 폴더안에 있는 파일이름들을 전부 배열, 혹은 json변수로만들어 사용해야 할 일이 생겼다. 이와같이 이미지 파일이 존재하면 해당 이미지파일을 보여주고 없으면 기본 이미지를 보여주는 과정인데 .... const handleImage = (e)=>{ e.target.src=default_img console.log(e.target.src) } return .... 이와같이 출력했는데 이와같이 해주면 정상적으로 작동은하지만 Next.js나 React의 public폴더안에 없는파일을 한번 연결해주는 과정이라 500에러가나게 된다. (500 Internal Server Error) 휴... 그래서 결국 방법을 강구해 보았다. 500개의 데이터목록이 있는데 350개의 이미.. 2022. 4. 2. 프론트엔드 개발자에게 Swagger란, axios로 API사용하는법 백엔드 팀원들과 협업하다보면 만들어준 API를 사용해야할 필요가있다. 1)회원가입,로그인,게시글작성,삭제,수정 그리고 현재 나같은경우 2)db에 있는걸 분류해서 카테고리 묶음으로 원하는 데이터를 뽑아올때 3)혹은 그외 프론트에서 특정요청을 보내면 원하는 데이터를 받아오는 경우 예시를 살펴보자 우리팀 천재 백엔드 개발자 솬군이 만들어준 api다, 3개의 속성이 있고 각 속성은 0~3까지 가지고있다. 그리고 중간에 Request URL까지 떡하니 나와있으니 편하게 API사용하듯이, React의 경우는 Axios를 사용해주면 된다. 내가 0,0,0을 전송하거나 혹은 2,1,3등을 전송하면 원하는 목록이 쭉 날아오는 식이다. 내가 1,0,3을 날려봤다. 이와같이 해당하는 결과가 쭈르르르륵 날아온다. axios(.. 2022. 3. 25. axios CORS 오류 휴우... 팀원이 만들어준 스웨거에서 POST요청을 하는데 자꾸 CORS오류가 났다. 분명 다른 사이트에있는 자료들을 axios로 가져오는데는 문제가 없는데 여기서만 CORS라...? 뭔가 문제가 있다고 생각했다. 분명 스웨거에서는 잘 작동했다. 근데 찾아보니 보통 이런경우는 백엔드 단에서 해결해줘야하는게 맞는거 같더라 물어보니 우리팀 천재 백엔드 개발자가 CORS 설정을 해줘서 잘 해결되었다. 이와같이 200OK..매우편안 여튼 일단 어딘가에서 제공되는 API가아니라 누군가 새로 만들어주는 거라면 물어봐보고 해결할 생각을해보자, proxySetup까지 찾아볼정도로 알아봤는데 다행이도 간단하게 해결 되었다. 참고한링크 https://qnrjs42.blog/react/react-cors [React] 다른.. 2022. 3. 25. fontawesome(폰트어썸) React와 Next.js에서 사용하기 npm i --save @fortawesome/fontawesome-svg-core # Free icons styles npm i --save @fortawesome/free-solid-svg-icons npm i --save @fortawesome/free-regular-svg-icons npm i --save @fortawesome/react-fontawesome@latest 이와같이 npm을 설치해준다 물론 yarn도 있다. https://fontawesome.com/docs/web/use-with/react/ Set Up with React Font Awesome 6 brings loads of new icons and features to the most popular icon set in th.. 2022. 3. 18. 이전 1 2 다음 반응형