[React Native] 영화 리뷰 모바일 앱 개발 이야기 #4
안녕하세요. 안피곤입니다.
이 시리즈는 리액트 네이티브로 영화 리뷰 모바일 앱을 만드는 과정입니다.
이번에는 포스팅 본문 내용을 보여주는 상세 화면을 구현합니다. body에 포함된 마크다운/HTML을 파싱하여 렌더링된 결과물을 네이티브 화면으로 출력합니다.
웹 화면과 최대한 비슷하게 구현하려고 노력했습니다. 하지만 아직 미흡한 부분이 보여서 WEB으로 가는 링크를 우측상단에 넣었습니다. 클릭하면 웹페이지로 이동합니다.
Remarkable : 마크다운(markdown) 파서
마크다운(markdown) 파서는 remarkable를 사용했습니다. remarkable는 마크다운 문서를 HTML로 변환해주는 라이브러리입니다. common/extensions 마크다운 문법을 모두 지원하고, syntax 플러그인과 매우 빠른 속도를 자랑합니다. 그리고 MIT 라이센스입니다.
다음은 remarkable를 사용한 일부 코드입니다.
React-Native Render HTML
HTML 렌더링에는 react-native-render-html를 사용했습니다. react-native-render-html는 리액트 네이티브 컴포넌트를 사용하여 HTML을 100% 네이티브 뷰로 렌더링해줍니다. 그리고 BSD-2-Clause 라이센스입니다.
다음은 react-native-render-html를 사용한 일부 코드입니다.
import HTMLView from 'react-native-render-html';
완성 화면
해피 코딩하세요~!
wonsama님의 [SCT] 스팀엔진 임대정보 반영 + SCT 채굴 알람(댓글)
@happyberrysboy 님이 스판 유료검색을 통해 @anpigon 님의 글을 선택했습니다.
유료 검색에서 선택된 글을 작성한 @anpigon 님에게는 0.5 SCT를 보상으로 지급되었습니다.
@happyberrysboy 님의 검색 만족도 평가 점수는 5 입니다.
와 유료검색은 이렇게 사용하는 거군요. 해피베리보이님 감사합니다.
유료검색 1호 대상자로 선정합니다~~~ ㅋㅋ
이건 triple A에도 적용할 법 하네요^^
aaa 태그를 추가해보심이 어떨까요?
사실은 Triple A를 염두에 두고 개발하고 있습니다. ㅋ 의견 주셔서 감사합니다.
풀보팅해드립니다. 만드시는 과정을 지켜볼께요^^
엌. 지켜보시는 겁니까? 열심히 개발해보겠습니다. ㅎㅎ
그리고 풀보팅 감사합니다.
해팅 코딩은 안피곤님이 하시구요^^ ㅋ
즐거운 한주 보내세요~~
그럼 독거노인님은 해피 코인 하세요~ ㅎㅎ
오호!! 해피 코인~ 감사합니다^^
제 글을 모델로 써주셔서 감사합니다.
그러니 저작권료를 저에게.......는 아니고
작지만 감사의 의미로 풀봇과 jcar보팅을 드리겠습니다. ㅎㅎㅎ
풀봇과 jar 보팅 너무나 감사합니다. ㅎㅎ 그리고 저작권료는 제가 흠...ㅎㅎ
Thank you for your continued support towards JJM. For each 1000 JJM you are holding, you can get an additional 1% of upvote. 10,000JJM would give you a 11% daily voting from the 700K SP virus707 account.
안녕하세요. @hodolbak님의 jcar토큰 보팅 선물입니다. ^^
좋은 한주 되세요.
jsquare님 너무 감사합니다. hodolbak님께도 감사하다고 전해주세요.
아낌없이 주는 나무 후원으로 왔습니다:)
Hi @anpigon!
Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your UA account score is currently 2.553 which ranks you at #16563 across all Steem accounts.
Your rank has improved 8 places in the last three days (old rank 16571).
In our last Algorithmic Curation Round, consisting of 166 contributions, your post is ranked at #91.
Evaluation of your UA score:
Feel free to join our @steem-ua Discord server