diff --git a/website/.gitignore b/website/.gitignore old mode 100644 new mode 100755 index 5395ea795..1b34df512 --- a/website/.gitignore +++ b/website/.gitignore @@ -1,12 +1,20 @@ -.DS_Store +# dependencies +/node_modules + +# production +/build -node_modules +# generated files +.docusaurus +.cache-loader -lib/core/metadata.js -lib/core/MetadataBlog.js +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local -website/translated_docs -website/build/ -website/yarn.lock -website/node_modules -website/i18n/* +npm-debug.log* +yarn-debug.log* +yarn-error.log* \ No newline at end of file diff --git a/website/README.md b/website/README.md old mode 100644 new mode 100755 index f3da77ff3..71505291a --- a/website/README.md +++ b/website/README.md @@ -1,193 +1,33 @@ -This website was created with [Docusaurus](https://docusaurus.io/). +# Website -# What's In This Document +This website is built using Docusaurus 2, a modern static website generator. -* [Get Started in 5 Minutes](#get-started-in-5-minutes) -* [Directory Structure](#directory-structure) -* [Editing Content](#editing-content) -* [Adding Content](#adding-content) -* [Full Documentation](#full-documentation) +### Installation -# Get Started in 5 Minutes - -1. Make sure all the dependencies for the website are installed: - -```sh -# Install dependencies -$ yarn -``` -2. Run your dev server: - -```sh -# Start the site -$ yarn start -``` - -## Directory Structure - -Your project file structure should look something like this - -``` -my-docusaurus/ - docs/ - doc-1.md - doc-2.md - doc-3.md - website/ - blog/ - 2016-3-11-oldest-post.md - 2017-10-24-newest-post.md - core/ - node_modules/ - pages/ - static/ - css/ - img/ - package.json - sidebar.json - siteConfig.js ``` - -# Editing Content - -## Editing an existing docs page - -Edit docs by navigating to `docs/` and editing the corresponding document: - -`docs/doc-to-be-edited.md` - -```markdown ---- -id: page-needs-edit -title: This Doc Needs To Be Edited ---- - -Edit me... -``` - -For more information about docs, click [here](https://docusaurus.io/docs/en/navigation) - -## Editing an existing blog post - -Edit blog posts by navigating to `website/blog` and editing the corresponding post: - -`website/blog/post-to-be-edited.md` -```markdown ---- -id: post-needs-edit -title: This Blog Post Needs To Be Edited ---- - -Edit me... +$ yarn ``` -For more information about blog posts, click [here](https://docusaurus.io/docs/en/adding-blog) - -# Adding Content - -## Adding a new docs page to an existing sidebar - -1. Create the doc as a new markdown file in `/docs`, example `docs/newly-created-doc.md`: - -```md ---- -id: newly-created-doc -title: This Doc Needs To Be Edited ---- +### Local Development -My new content here.. ``` - -1. Refer to that doc's ID in an existing sidebar in `website/sidebar.json`: - -```javascript -// Add newly-created-doc to the Getting Started category of docs -{ - "docs": { - "Getting Started": [ - "quick-start", - "newly-created-doc" // new doc here - ], - ... - }, - ... -} +$ yarn start ``` -For more information about adding new docs, click [here](https://docusaurus.io/docs/en/navigation) +This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server. -## Adding a new blog post +### Build -1. Make sure there is a header link to your blog in `website/siteConfig.js`: - -`website/siteConfig.js` -```javascript -headerLinks: [ - ... - { blog: true, label: 'Blog' }, - ... -] ``` - -2. Create the blog post with the format `YYYY-MM-DD-My-Blog-Post-Title.md` in `website/blog`: - -`website/blog/2018-05-21-New-Blog-Post.md` - -```markdown ---- -author: Frank Li -authorURL: https://twitter.com/foobarbaz -authorFBID: 503283835 -title: New Blog Post ---- - -Lorem Ipsum... +$ yarn build ``` -For more information about blog posts, click [here](https://docusaurus.io/docs/en/adding-blog) +This command generates static content into the `build` directory and can be served using any static contents hosting service. -## Adding items to your site's top navigation bar +### Deployment -1. Add links to docs, custom pages or external links by editing the headerLinks field of `website/siteConfig.js`: - -`website/siteConfig.js` -```javascript -{ - headerLinks: [ - ... - /* you can add docs */ - { doc: 'my-examples', label: 'Examples' }, - /* you can add custom pages */ - { page: 'help', label: 'Help' }, - /* you can add external links */ - { href: 'https://github.com/facebook/Docusaurus', label: 'GitHub' }, - ... - ], - ... -} ``` - -For more information about the navigation bar, click [here](https://docusaurus.io/docs/en/navigation) - -## Adding custom pages - -1. Docusaurus uses React components to build pages. The components are saved as .js files in `website/pages/en`: -1. If you want your page to show up in your navigation header, you will need to update `website/siteConfig.js` to add to the `headerLinks` element: - -`website/siteConfig.js` -```javascript -{ - headerLinks: [ - ... - { page: 'my-new-custom-page', label: 'My New Custom Page' }, - ... - ], - ... -} +$ GIT_USER= USE_SSH=1 yarn deploy ``` -For more information about custom pages, click [here](https://docusaurus.io/docs/en/custom-pages). - -# Full Documentation - -Full documentation can be found on the [website](https://docusaurus.io/). +If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch. diff --git a/website/core/Footer.js b/website/core/Footer.js deleted file mode 100644 index f58e5298a..000000000 --- a/website/core/Footer.js +++ /dev/null @@ -1,79 +0,0 @@ -/** - * Copyright (c) 2017-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -const React = require('react'); - -class Footer extends React.Component { - docUrl(doc, language) { - const { baseUrl } = this.props.config; - return `${baseUrl}docs/${language ? `${language}/` : ''}${doc}`; - } - - pageUrl(doc, language) { - const { baseUrl } = this.props.config; - return baseUrl + (language ? `${language}/` : '') + doc; - } - - render() { - return ( - - ); - } -} - -module.exports = Footer; diff --git a/website/docker/docker-compose.yml b/website/docker/docker-compose.yml index 6711192ae..1e535c420 100644 --- a/website/docker/docker-compose.yml +++ b/website/docker/docker-compose.yml @@ -9,10 +9,8 @@ services: volumes: - ./docs:/app/docs - ./website/blog:/app/website/blog - - ./website/core:/app/website/core - - ./website/i18n:/app/website/i18n - ./website/pages:/app/website/pages - ./website/static:/app/website/static - ./website/sidebars.json:/app/website/sidebars.json - - ./website/siteConfig.js:/app/website/siteConfig.js + - ./website/docusaurus.config.js:/app/website/docusaurus.config.js working_dir: /app/website diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js new file mode 100755 index 000000000..99f6860cb --- /dev/null +++ b/website/docusaurus.config.js @@ -0,0 +1,88 @@ +const siteConfig = { + title: 'React Native Testing Library', // Title for your website. + tagline: 'Helps you to write better tests with less effort.', + url: 'https://callstack.github.io', // Your website URL + baseUrl: '/react-native-testing-library/', // Base URL for your project + favicon: 'img/owl.png', + + projectName: 'react-native-testing-library', + organizationName: 'callstack', + + themeConfig: { + navbar: { + title: 'React Native Testing Library', + style: 'dark', + logo: { + alt: 'React Native Testing Library', + src: 'img/owl.png', + }, + links: [ + {to: 'docs/getting-started', label: 'Docs', position: 'right'}, + { + repoUrl: 'https://github.com/facebook/docusaurus', + label: 'GitHub', + position: 'right', + }, + ], + }, + footer: { + style: 'dark', + links: [ + { + title: 'Docs', + items: [ + { + label: 'Getting Started', + to: 'docs/getting-started', + }, + { + label: 'API Reference', + to: 'docs/api', + }, + ], + }, + { + title: 'Community', + items: [ + { + label: 'Slack Overflow', + href: 'https://stackoverflow.com/questions/tagged/react-native-testing-library', + }, + { + label: 'Discord channel', + href: 'https://discord.gg/QbGezWe', + }, + ], + }, + { + title: 'More', + items: [ + { + label: 'Github', + href: 'https://github.com/callstack/react-native-testing-library', + } + ], + }, + ], + }, + }, + presets: [ + [ + '@docusaurus/preset-classic', + { + docs: { + // docs folder path relative to website dir. + path: '../docs', + // sidebars file relative to website dir. + sidebarPath: require.resolve('./sidebars.json'), + }, + theme: { + customCss: require.resolve('./src/css/custom.css'), + }, + }, + ], + ], +}; + + +module.exports = siteConfig; diff --git a/website/package.json b/website/package.json old mode 100644 new mode 100755 index 6c6c2a605..246995aae --- a/website/package.json +++ b/website/package.json @@ -3,17 +3,28 @@ "version": "0.0.0", "private": true, "scripts": { - "examples": "docusaurus-examples", - "start": "docusaurus-start", - "build": "docusaurus-build", - "publish-gh-pages": "docusaurus-publish", - "write-translations": "docusaurus-write-translations", - "version": "docusaurus-version", - "rename-version": "docusaurus-rename-version" + "start": "docusaurus start", + "build": "docusaurus build", + "swizzle": "docusaurus swizzle", + "deploy": "docusaurus deploy" }, "dependencies": { - "docusaurus": "^1.5.1", - "react": "^16.8.1", - "react-dom": "^16.8.1" + "@docusaurus/core": "^2.0.0-alpha.27", + "@docusaurus/preset-classic": "^2.0.0-alpha.27", + "classnames": "^2.2.6", + "react": "^16.10.2", + "react-dom": "^16.10.2" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] } } diff --git a/website/pages/en/index.js b/website/pages/en/index.js deleted file mode 100644 index e86e59ffc..000000000 --- a/website/pages/en/index.js +++ /dev/null @@ -1,100 +0,0 @@ -/** - * Copyright (c) 2017-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -const React = require('react'); -const CompLibrary = require('../../core/CompLibrary.js'); - -const siteConfig = require(`${process.cwd()}/siteConfig.js`); - -function docUrl(doc, language) { - return `${siteConfig.baseUrl}docs/${language ? `${language}/` : ''}${doc}`; -} - -class Button extends React.Component { - render() { - return ( -
- - {this.props.children} - -
- ); - } -} - -Button.defaultProps = { - target: '_self', -}; - -const SplashContainer = props => ( -
-
-
{props.children}
-
-
-); - -const ProjectTitle = () => ( - -

- {siteConfig.title} - {siteConfig.tagline} -

- - -); - -class HomeSplash extends React.Component { - render() { - return ( - -
- - -
- - - - - ); - } -} - -class Index extends React.Component { - render() { - const language = this.props.language || ''; - - return ; - } -} - -module.exports = Index; diff --git a/website/sidebars.json b/website/sidebars.json old mode 100644 new mode 100755 diff --git a/website/siteConfig.js b/website/siteConfig.js deleted file mode 100644 index c665055d0..000000000 --- a/website/siteConfig.js +++ /dev/null @@ -1,89 +0,0 @@ -/** - * Copyright (c) 2017-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -// See https://docusaurus.io/docs/site-config for all the possible -// site configuration options. - -const repoUrl = 'https://github.com/callstack/react-native-testing-library'; - -const siteConfig = { - title: 'React Native Testing Library', // Title for your website. - tagline: 'Helps you to write better tests with less effort.', - url: 'https://callstack.github.io', // Your website URL - baseUrl: '/react-native-testing-library/', // Base URL for your project - - // Used for publishing and more - projectName: 'react-native-testing-library', - organizationName: 'callstack', - // For top-level user or org sites, the organization is still the same. - // e.g., for the https://JoelMarcey.github.io site, it would be set like... - // organizationName: 'JoelMarcey' - - // For no header links in the top nav bar -> headerLinks: [], - headerLinks: [ - { doc: 'getting-started', label: 'Docs' }, - { href: repoUrl, label: 'GitHub' }, - ], - - /* path to images for header/footer */ - headerIcon: 'img/owl.png', - footerIcon: 'img/owl.png', - favicon: 'img/owl.png', - - /* Colors for website */ - colors: { - primaryColor: '#262626', - secondaryColor: '#bf8a65', - }, - - /* Custom fonts for website */ - /* - fonts: { - myFont: [ - "Times New Roman", - "Serif" - ], - myOtherFont: [ - "-apple-system", - "system-ui" - ] - }, - */ - - // This copyright info is used in /core/Footer.js and blog RSS/Atom feeds. - copyright: `Copyright © ${new Date().getFullYear()} Callstack Open Source`, - - highlight: { - // Highlight.js theme to use for syntax highlighting in code blocks. - theme: 'default', - }, - - // Add custom scripts here that would be placed in