feat: Apply Mock API to Demo Page

[suinj8]

데모페이지에 Mock API적용하였습니다.

[LimEunSang]

위 사진은 백에서 전달하는 데이터 형식입니다. 저 중에 description, url 정보는 출력하지 않고있습니다. 따로 이유가 있을까요?

---

다음에는 이런식으로 결과 화면 캡쳐도 해주세요. 저희 당장 PR 등록할 땐 귀찮더라도 보는 사람이 편하고 결국 나도 보는 사람중 하나이기 때문에 결과 화면도 보여주자고 다같이 동의했었어요.

---

subheader <- 공지사항으로 돼있네요. 수정해주세요.

[LimEunSang]

그냥 주석처리한 더미데이터 지워버리죠. api 어떻게 받아오는지 코드 내에서 확인할 수 있게 지우지 말고 주석으로 남겨달라고 했었는데 데이터 요청 주소 직접 들어가면 확인 가능하네요.

[suinj8]

네

[suinj8]

위 사진은 백에서 전달하는 데이터 형식입니다. 저 중에 description, url 정보는 출력하지 않고있습니다. 따로 이유가 있을까요?

description이 짧지않을텐데 포함해버리면 지저분 해질거 같아서 넣지 않았습니다.
넣는건 간단해서 넣는게 좋아보이시나요?

url정보는 보여주기보다는 클릭하면 자동으로 이동하게 구현하려고 하였습니다.

subheader <- 공지사항으로 돼있네요. 수정해주세요.
수정하겠습니다.

[baaaam771]

참고가 될 것 같아서 국민대학교 데모 사이트 첨부합니다 여기도 표 형식으로 데모가 구현되어 있는데 클릭하면

이런식으로 넘어가는 형태입니다

http://nlp.kookmin.ac.kr/demo/index.html

[euny0ung]

제목 부분이 긴 편이라서 제목만 적으면 너무 휑하기도 하고, 보는 사람 입장에서 생각해보면 조금 불친절하다고 느껴질 수도 있어서 설명을 적는게 낫다고 생각했습니다. 그런데 국민대 데모 페이지를 보고 생각이 바뀌었어요. 여기는 프로그램 자체에 설명이 써뒀네요. 만약 국민대처럼 프로그램에 설명을 쓸 수 있다면 굳이 description을 출력하지 않아도 괜찮을 것 같아요. 휑한 문제도 영어제목, 한글제목을 같이 써준다면 해결될 것 같구요.

[LimEunSang]

description이 짧지않을텐데 포함해버리면 지저분 해질거 같아서 넣지 않았습니다. 넣는건 간단해서 넣는게 좋아보이시나요?

저는 구지 url을 타고 데모 사이트로 이동하지 않아도 홈페이지에서 어떤 역할을 하는 데모인지 설명을 적어 놓는 것이 맞다고 생각하는데 설명을 적는 공간이 적절하지 않다보니 고민이 되네요. 이 부분은 수인님이 판단한 대로 구현합시다.

url정보는 보여주기보다는 클릭하면 자동으로 이동하게 구현하려고 하였습니다.

아 좋네요 알겠습니다

[LimEunSang]

LGTM

[baaaam771]

LGTM 확인했습니다!

[euny0ung]

LGTM!

[baaaam771]

확인해본 결과 이러한 에러 코드가 나오긴하는데 toast ui 적용할 때부터 저한테는 나왔던 에러 코드입니다

해결방법은 미리 찾아놨는데요
다른분들은 이 에러코드가 나오는지 안나오는지 아직 확인을 못해봐서
develope 브랜치로 병합된 이후에 에러 수정하려했습니다

참고로 해당 에러는 toast ui 공식 깃허브에도 이슈로 등록이 되어 있습니다
nhn/tui.editor#2137
라이브러리 내부적인 문제라 자세한 상황파악은 어렵지만
에러코드에서 말해주는 것처럼 소스맵(Source Map)과 관련된 이슈로 보입니다.
그렇기 때문에 단순하게 소스맵 사용을 중단시켜주면 해결이 됩니다.

// package.json 파일

"scripts": {
    "start": "GENERATE_SOURCEMAP=false react-scripts start",
    ...
}, ...

[euny0ung]

저도 에러가 뜨네요.
범기님이 말해주신것처럼 저 코드를 추가하면 해결되는데 윈도우에서는 위의 코드가 안먹힙니다. 이것도 추가 부탁드려요!

"scripts": {
   "winBuild": "set \"GENERATE_SOURCEMAP=false\" && react-scripts build",
    ...
}, ...

[suinj8]

확인해본 결과 이러한 에러 코드가 나오긴하는데 toast ui 적용할 때부터 저한테는 나왔던 에러 코드입니다
해결방법은 미리 찾아놨는데요 다른분들은 이 에러코드가 나오는지 안나오는지 아직 확인을 못해봐서 develope 브랜치로 병합된 이후에 에러 수정하려했습니다

참고로 해당 에러는 toast ui 공식 깃허브에도 이슈로 등록이 되어 있습니다 nhn/tui.editor#2137 라이브러리 내부적인 문제라 자세한 상황파악은 어렵지만 에러코드에서 말해주는 것처럼 소스맵(Source Map)과 관련된 이슈로 보입니다. 그렇기 때문에 단순하게 소스맵 사용을 중단시켜주면 해결이 됩니다.

// package.json 파일

"scripts": {
    "start": "GENERATE_SOURCEMAP=false react-scripts start",
    ...
}, ...

윈도우에서는 수정하면 실행되지 않습니다. 따라서 적용하지 않았습니다.

[suinj8]

저도 에러가 뜨네요. 범기님이 말해주신것처럼 저 코드를 추가하면 해결되는데 윈도우에서는 위의 코드가 안먹힙니다. 이것도 추가 부탁드려요!

"scripts": {
   "winBuild": "set \"GENERATE_SOURCEMAP=false\" && react-scripts build",
    ...
}, ...

실행은 되지만 여전히 warning이 뜹니다.
따라서 추가하지 않았습니다.

[suinj8]

결론적으로 위 두분히 말씀해주신거 적용해서 해보았는데
범기님방식은 윈도우라 적용이 안되고
은영님방식은 적용해도 바뀌는것이 없어 둘다 적용하지 않고 병합하였습니다.