React와 Redux로 구축 된 웹 사이트를 단순화하는 방법은 무엇입니까?

Question

저는 시스템 생물학 실험실에서 일합니다. 나 자신을 포함한 모든 사람들은 웹 개발을위한 시간이나 경향이 거의없는 연구자입니다. 그러나 이전 연구원은 React와 Redux를 사용하여 아름다운 웹 사이트를 만들었습니다. 수년간이 웹 사이트를 유지 관리 할 수 ​​있어야하며 여러 연구자가 매주 콘텐츠를 업데이트 할 수 있어야합니다.

우리의 문제는 웹 사이트가 업데이트하기에는 너무 복잡하다는 것입니다. 예를 들어 뉴스 기사를 추가하려면 누군가가 모든 노드 모듈을 설치하고 JSX 컴파일 오류를 디버그하는 방법을 알고 Story 구성 요소를 작성한 다음 NewsStory 뷰로 가져 와서 노드 서버를 다시 배포해야합니다. 나는 이것을 지금 처리 할 수 ​​있지만 곧 떠날 것이다. 우리는 모든 새로운 관리자가 사이트를 업데이트하기 위해 React와 Redux를 배워야 할 것이라고 걱정합니다.

여기 내 질문 : 기본적으로 정적 사이트의 내용을 쉽게 업데이트 할 수있는 반응 패턴이 있습니까? 예를 들어, Angular를 사용하여 다른 실험실 사이트를 만들었고 뉴스 기사를 업데이트하려는 경우 NewsController에 새 JSON 개체를 추가 한 다음 수정 된 JavaScript 파일을 FTP 서버를 통해 업로드합니다. 이 워크 플로는 대부분의 사람들이 실험실에서 훨씬 쉽게 사용할 수 있습니다.

Answer 1

Redux 저장소는 각도 데이터 컨트롤러입니다. Redux/React 웹 사이트에서 Angular와 함께 사용하는 것과 동일한 프로세스를 구현할 수 있습니다.

데이터 (예 : 스토리)가 표시 될 스토리 구성 요소로 전달됩니다. 이 http://redux.js.org/docs/basics/Reducers.html을보십시오.

하지만 프론트 엔드 개발을 배우기에 충분한 관심과 자원이 없다면 Word Press와 같은 것으로 더 나아질 것입니다.

Answer 2

React는 복잡한 UI를 유지 관리하기 쉽게하기위한 도구입니다. 페이 스북 팀에 의해 만들어지고 본질적으로 Redux 프로젝트에 의해 복사되는 플럭스 아키텍처는 React 애플리케이션이 복잡 해짐에 따라 컴포넌트 간 복잡한 상태를 단순화하는 방법이다.

단순한 CMS 유형 사이트에는 필요하지 않은 경우 React를 선택하여 울타리를 휘둘 렀던 것처럼 들립니다. 그것을 간단하게 유지하고 Wordpress CMS 유형 사이트에 대한 반응을 사용하는 것에 대해 언급해야 할 것이 있습니다. 파이썬은 생물학 분야에서 비교적 인기있는 옵션이기 때문에 인증 관리를위한 쉬운 통합을위한 간단한 CMS 솔루션을 위해 장고를 추천합니다.

이것은 내가 어제 나와 함께 공유하는 재미 있고 다소 진실한 트윗을 연상시킨다. https://twitter.com/iamdevloper/status/517616294909464576

Answer 3

Story 구성 요소는 모든 종류의 스토리 데이터를 렌더링하기에 충분할 정도로 잘 만들 수 있기를 바랍니다.

그렇다면 여기를 처리하는 간단한 방법이 있습니다. componentDidMount() 구성 요소의 라이프 사이클 메소드에서 표시하려는 서버의 모든 스토리 (json 객체의 배열)를 가져오고 (axios, superagent 또는 fetch 사용) NewsStory 구성 요소의 상태로 저장합니다. 그런 다음 render() 메서드가 NewsStory 인 경우 상태 배열을 매핑하여 각 스토리 객체에 대해 Story 구성 요소를 렌더링합니다 (각 스토리를 스토리 구성 요소로 전달).

나머지 절반은 이야기에 대한 CRUD UI입니다. 또는 각도 앱과 마찬가지로 수동으로 json을 유지 관리하십시오.