[30-01] 웹 에디터와 폼 라이브러리

안녕하세요! M.Choi님!현재 웹에디터 수업을 그대로 따라서 작동시켜 보았는데요!이상없이 작동이 잘 되는 것 같아요!이런 경우에는 M.Choi님이 설치하여 실행중이신 버전(React, Next, ReactQuill)들과 제가 수업에서 설치한 버전 (React, Next, ReactQuill) 간에 차이가 있는지 가장 먼저 확인을 해 볼 필요가 있을 것 같아요!실패하셨던 버전을 알려주시면, 해당 버전으로 재시도하여 해결 방법에 도움을 드려볼게요!^^

[18-05 게시글 이미지와 함께 등록] 타입 지정 질문드립니다

안녕하세요! 승엽님!!(느낌표) 는 "file 무조건 있을거야! 그러니까 넌 그냥 에러 보여주지마!!" 방식이랍니다!물론, 개발자가 더 확실히 타입을 단언할 수 있는 경우가 존재하는데요!이런 경우에는 사용하기도 한답니다! 다만, 일반적으로는 자제해 주세요!^^

npm_access_token 오류

안녕하세요! yoonseong님!npm에 라이브러리를 만들어서 올리는 과정에 있으신 것 같아요!yarn publish를 입력하셨을 때 진행 과정을 설명드리면, 해당 소스코드 내의 1) .npmrc 파일을 찾아서 읽고, 2)최종적으로 publish 하게 된답니다!1) .npmrc 파일을 찾아서 읽고,=> 여기서 .npmrc 파일에는 NPM_ACCESS_TOKEN을 입력하라는 형태의 로직이 들어가 있으실건데요!아마도 ....authToken=${NPM_ACCESS_TOKEN}.... 와 같은 형태의 코드 1줄이 있겠죠?! 2)최종적으로 publish=> 위에서 .npmrc 파일에서 ${NPM_ACCESS_TOKEN} 변수 값이 필요하다고 하였는데, 따로 넣어 주지 않게되면 publish에 실패하게 됩니다.수업에서는 해당 문제를 해결하기 위해, NPM_ACCESS_TOKEN=OOO yarn publish 와 같은 명령을 주었답니다.이 명령은 내 컴퓨터의 환경변수에 NPM_ACCESS_TOKEN 이라는 환경변수를 만들고, 그 안에OOO 값을 넣은상태로 yarn publish 해줘! 라는 뜻이에요!따라서, 위의 1), 2) 모두를 만족하기 때문에 정상적으로 publish가 될 수 있었던 거예요!하지만, 이 명령은 unix 기반의 사용 방법이므로 linux 운영체제나 mac 운영체제 등에서 사용 가능하답니다!따라서, 윈도우에서는 윈도우 환경변수를 만들어 사용하는 방법을 시도해 보셔야 하는데요!powershell에서 환경변수를 만들고 yarn publish 해보실 수 있어요!마지막으로, .npmrc 파일의 ......authToken=${NPM_ACCESS_TOKEN} 에서 .....authToken=OOO 와 같이 직접 입력하는 경우, yarn publish 명령만으로도 환경변수 없이 배포가 가능하기 때문에, 이를 먼저 실습해 보시길 권장드립니다!(이에 성공하셨다면, 윈도우 환경변수를 적용하는 실습도 추가로 진행해 보세요!^^)

emotion대신 tailwind를 사용하는 이유가 뭔가요?

안녕하세요! 지성님!react17 => react18버전으로 올라오면서, "서버컴포넌트"란 개념이 생겼어요!이 과정에서 폴더구조 셋팅 방식에 변경이 생겼는데요!* 1) 앱라우터 방식: 신규 서버컴포넌트기반 방식(app 폴더)* 2) 페이지라우터 방식: 기존방식(pages 폴더)문제는, 이 앱라우터방식(서버컴포넌트방식)에서 CSS-IN-JS(emotion, styled-components 등)의 호환이 어려운 문제가 있어요!따라서, 그나마 가장 CSS-IN-JS와 비슷한 방식으로 사용하는 CSS-Module (nextjs 기본 지원)을 채택하게 되었구요!이미 많은 회사에서 동일한 방식으로 사용중에 있답니다!추가로, 이를 글로벌하게 공통적으로 처리하는 경우에 tailwind를 사용하고 있답니다!(다시말해, tailwind를 메인으로 사용하고 있지 않아요!)마지막으로, 모든 회사가 최신 앱라우터방식을 사용하는데에는 사실상 어려움이 있어요.특히나, 규모가 있는 회사들은 마이크로프론트엔드(MFE) 등의 기술을 사용하게 되는데, 이 역시 마찬가지로 앱라우터방식에서 호환이 어려우므로 페이지라우터를 사용하는 경우가 많이 있답니다! (이 때는 여전히 CSS-IN-JS 방식이 적용 가능하므로, 최신기술에 너무 의존하는 것은 좋은 방법이 아니랍니다!)넓은 시야로 궁금증을 가지며 공부하시는 것을 보니, 지성님의 깊이있는 성장이 기대되네요!^^

서버 502 error

안녕하세요! 민선님!불편을 드려 죄송합니다!잠시 서버 에러가 있었던 것 같아요!현재 해결되었으므로, 다시 시도해 주세요!

리액트 1강

안녕하세요! HHun님! react와 react-dom의 다운로드 주소가 ...production.js 로 끝나고 있어요!수업땐 ...development.js 로 끝나는 주소를 사용했었는데, 이 주소를 사용해 주셔야 개발 연습시 다운로드가 가능해요!다음으로 ">" 관련된 에러는 바벨이 없을 때 나오는 에러 사항이에요!하지만, 올려주신 스크린샷을 보니, 바벨이 설치되어 있네요!따라서, 기존에 열려있던 크롬 브라우저를 모두 종료하고, 다시 실행하면 잘 되실 거예요!^^

Vs code 코드 저장하면 정렬 이상하게 되요!

안녕하세요! HHun님!vscode에서 prettier 라는 익스텐션(확장프로그램)을 설치하셨기 때문에 그렇답니다!그리고, 저장후 자동 prettier 실행하기 설정에 체크하신 것 같아요! 그러면, 이 방식을 하면 안되는 것인가?! 그건 아닙니다! 셋팅은 잘 하셨구요!, 다만 선택적으로 prettier를 무시하고 싶은 부분의 윗 줄에다 prettier-ignore를 주석으로 달아주시면 된답니다!^^ HTML인 경우 주석 다는 방법: ... JS인 경우 주석 다는 방법: //// prettier-ignore if(1+1 === 2) { console.log("...") }

input text 빈 공간 ""

안녕하세요! HHun님! 일반적으로 HTML에 보여지는 내용들은 모두 문자열이라고 보시면 됩니다!"" // 아무것도 없는 문자열 "바나나" // "바나나" 문자열 "23" // "23" 문자열 => 참고로 이건 숫자가 아니라, 계산도 안됨 " " // 한칸 띈 공백이 들어있는 문자열 => " " 공백만큼의 투명 문자열이 안에 들어있어요!여기서, 한칸 띈 공백이 들어있는 문자열은 비어있는 것이 아니며, 저 간격만큼의 투명문자열이 있다고 보시면 됩니다!^^

api 질문입니다.

안녕하세요! 임프런님!해당 문제는 서버에서 발생한 문제로, 현재 해결되었습니다. 다시 한 번 시도해 보세요!^^

fetchPointTransactionsOfBuying API에서 특정 정보만 불러와지지 않습니다.

안녕하세요! summery님!해당 문제는 서버에서 발생한 문제로, 현재 해결되었습니다. 다시 한 번 시도해 보세요!^^