Octopus 는 소프트웨어 다이어그램이 내장 된 서버가없고 설치하기 쉬운 내부 위키 페이지입니다. 컨텐츠를 작성하기 위해 Markdown을 사용하고 쉬운 소프트웨어 설명서를 위해 GraphViz 및 FlowChart.js 다이어그램으로 향상시킵니다.
다음은 기본 위키 페이지입니다.
Octopus는 Google Firebase를 백엔드로 사용하는 Jamstack 앱입니다. 웹 서버 (예 : Apache) 또는 데이터베이스 (예 : MySQL)가 필요하지 않습니다. NetLify를 사용하여 앱을 CDN에 무료로 배포 할 수 있습니다.
Wiki (지원되는 제공 업체 : Google, Github, 이메일/암호, 트위터 및 전화), Wiki를 읽거나 편집하려면 사용자에게 로그인해야합니다.
읽기 및 편집에 대한 액세스 규칙을 작성 (특정 사용자 또는 인증 도메인 제한),
사용자 정의 도메인 아래 호스트 위키 페이지.
Markdown 언어로 새 위키 페이지를 만들고
Wiki 페이지에 쉽게 연결하려면 메뉴 편집 (Markdown 사용)
Markdown 컨텐츠 내부에 GraphViz 및 FlowChart.js 다이어그램 포함,
누가 Wiki 기사를 읽고 있는지 확인하십시오.
Wiki 프론트 엔드를 React (Create-React-App)로 조정하십시오.
이 저장소를 컴퓨터로 복제하십시오.
config 템플릿 파일 ( src/config/config.template.js
)을 src/config/config.js
로 복사하십시오.
cp src/config/config.template.js src/config/config.js
참고 :
src/config/config.js
파일을 저장소에 안전하게 커밋 할 수 있습니다. 이 파일은 민감한 자격 증명을 저장하지 않습니다. 모든 구성 변수는 어쨌든.js
파일에서 공개적으로 제공됩니다.
여기에서 새로운 Firebase 프로젝트를 만듭니다 : https://firebase.google.com/
"웹 앱에 Firebase 추가"를 선택하고 구성을 src/config/config.js
에 2 단계에서 만든 복사하십시오.
Firebase Console에서 인증 > 로그인 메소드 로 이동하여 제공자를 선택하고 활성화하십시오. 문어는 Google 및 Github 제공 업체에서 테스트되었습니다.
여전히 인증 > 로그인 메소드 섹션 섹션에서 앱을 호스팅하는 도메인을 승인 된 도메인 목록에 추가하십시오.
앱 빌드 :
npm install npm run build
build/
디렉토리를 웹 서버에 배포하십시오.
웹 서버에서 앱 호스팅을 건너 뛸 수 있습니다 (위의 설치 안내서에서 8 단계). 클라우드 기반 CDN 제공 업체에 앱을 배포하는 것입니다.
NetLify를 사용하는 것이 좋습니다.
각 커밋 후 Forked Octopus Github Repo를 자동으로 배치합니다. 또한 모든 사용자가 즉시 액세스 할 수있는 즉시 사용 가능한 URL을 준비합니다. 나중에, 당신은 더 전문적으로 보이도록 사용자 정의 도메인을 설정할 수 있습니다.
참고 : NetLify를 통해 Octopus를 배포 할 때 설정 마법사의 다음 세부 정보를 작성하십시오.
빌드 명령 :
npm run build
게시 디렉토리 :build
기본적으로 모든 사용자는 Wiki 페이지를보고 편집 할 수 있습니다. 아마도 이것은 당신이 기대하는 것이 아닙니다!
회사에만 콘텐츠에 액세스 할 수 있도록 FireBase Console > 데이터베이스 > 규칙 으로 이동하여 WIKI 페이지를 읽고 편집 할 수있는 사람을 제한하십시오.
Google 로그인 제공 업체를 사용하고 회사 이메일 주소가 @livechatinc.com 으로 끝나는 경우 예제 규칙입니다.
{ "rules": { ".read": "auth.token.email.endsWith('@livechatinc.com')", ".write": "auth.token.email.endsWith('@livechatinc.com')" } }
실시간 데이터베이스 규칙 문서에서 가능한 보안 규칙에 대한 자세한 내용을 읽을 수 있습니다.
문어는 사용하기가 매우 쉽도록 설계되었습니다.
새 페이지를 만들려면 생성하려는 URL을 입력하기 만하면됩니다 (예 : https://<your-octopus-domain>/test/new-page
. 해당 페이지가 아직 생성되지 않은 경우 다음 화면이 표시됩니다.
"이 페이지 만들기"를 클릭하면 새 페이지가 생성되어 기본 컨텐츠로 작성되어 편집 할 준비가됩니다.
페이지가 준비되면 메뉴에 쉽게 포함시킬 수 있습니다.
그게 다야. 모든 팀원을 문어로 보내면 기여할 준비가되었습니다!
우리는 왜 문어를 만들었습니까?
우리는 LiveChat에서 내부 시스템을 문서화하기 위해 사용하기 쉬운 소프트웨어를 찾는 데 어려움을 겪었습니다.
우리는 비 기술적 인 사람들 에게 쉽게 기여하고 편집 가능한 소프트웨어 다이어그램을 포함하기를 원했습니다. 우리는 만족스러운 제품을 찾을 수 없었기 때문에 제품을 만들었습니다.
Create-React-App을 통해 반응합니다.
viz.js
flowchart.js
중포 기지
15.09.2017- ".png as. png"옵션
13.09.2017- 초기 릴리스
Bartosz olchówka / cto @ livechat
이 프로젝트는 MIT 라이센스에 따라 라이센스가 부여됩니다. 자세한 내용은 라이센스 파일을 참조하십시오.