From dc0bc8fec40f4ad78008dfcfc524f96ddbe8f151 Mon Sep 17 00:00:00 2001 From: Yasuaki Uechi Date: Wed, 31 Jul 2019 13:57:48 +0900 Subject: [PATCH] docs: update document --- CONTRIBUTING.md | 50 ++++++++++++++++++++++++++++-------- web/src/App.js | 3 ++- web/src/components/Footer.js | 13 ++++++---- 3 files changed, 49 insertions(+), 17 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index d420091..a0d6255 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -2,7 +2,7 @@ ## Setup environment -Install `now` for development: +Install `now` for development server: ``` yarn global add now @@ -17,30 +17,29 @@ yarn start ## Add new provider -Create `web/src/components/cards/.js` and paste following GitHub example into it: +Create `web/src/components/cards/.js` and paste following template into it: ```jsx import React from 'react' import { FaGithub } from 'react-icons/fa' import { Card } from '../Card' -import { DedicatedAvailability } from '../Availability' +import { ExistentialAvailability } from '../Availability' import { capitalize } from '../../util/text' -export default function CratesioCard({ name }) { +export default function NewCard({ name }) { return ( {(name) => ( - } /> )} @@ -49,6 +48,31 @@ export default function CratesioCard({ name }) { } ``` +and add the card to `/web/src/App.js`: + +```jsx +import NewCard from './components/cards/NewCard' +``` + +```jsx + + Result for {query} + + + + + + + + + + + + + + +``` + ### ExistentialAvailability `ExistentialAvailability` check if the response from passed URL returns `404` or not. @@ -57,4 +81,8 @@ For example, `` will send a request to `https://namae.dev/availability//` which is routed to `/api/services/github.js` in the repo. +For example, `` will send a request to `https://namae.dev/availability//` which is routed to `/api/services/.js` in the repo. + +``` + +``` diff --git a/web/src/App.js b/web/src/App.js index 183db4a..11eb216 100644 --- a/web/src/App.js +++ b/web/src/App.js @@ -4,6 +4,8 @@ import styled from 'styled-components' import { useDeferredState } from './hooks/state' import { mobile } from './util/css' +import Footer from './components/Footer' + import GithubCard from './components/cards/GithubCard' import DomainCard from './components/cards/DomainCard' import HomebrewCard from './components/cards/HomebrewCard' @@ -14,7 +16,6 @@ import JsOrgCard from './components/cards/JsOrgCard' import PypiCard from './components/cards/PypiCard' import S3Card from './components/cards/S3Card' import CratesioCard from './components/cards/CratesioCard' -import Footer from './components/Footer' export default function App() { const [query, setQuery] = useDeferredState(1000) diff --git a/web/src/components/Footer.js b/web/src/components/Footer.js index a1c440e..36cb983 100644 --- a/web/src/components/Footer.js +++ b/web/src/components/Footer.js @@ -1,14 +1,14 @@ import React from 'react' import styled from 'styled-components' -import { FaTwitter, FaGlobe } from 'react-icons/fa' +import { FaTwitter, FaGithubAlt } from 'react-icons/fa' export default function Footer() { return (

Made by U with{' '} - - 🐤 + + ☕️

@@ -18,8 +18,11 @@ export default function Footer() { rel="noopener noreferrer"> {' '} - - + +