add /docs link

swlab-main/src/components/Banner.jsx

 // @ts-nocheck
+import { useCallback } from 'react'
 import { SiGithub } from 'react-icons/si'
 import styled from 'styled-components'
 import Button from './Button'
@@ -10,6 +11,10 @@ const backdropStyle = {
 }
 
 export default function Banner () {
+  const onMoveDocPage = useCallback(() => {
+    window.location.href = 'https://swlab.bwg.co.kr/docs'
+  }, [])
+
   return (
     <Wrapper>
       <Backdrop style={backdropStyle} />
@@ -18,7 +23,7 @@ export default function Banner () {
         <BannerTitle type='sub' fontSize='3.5em'>Software Lab.</BannerTitle>
         <BannerDesc>Analyzing new technologies and ideas • Developing innovative products and services</BannerDesc>
         <ButtonGroup>
-          <Button text='Documetation' />
+          <Button onClick={onMoveDocPage} text='Documetation' />
           <Button text='GitHub' icon={<SiGithub />}/>
         </ButtonGroup>
       </Overlay>

swlab-main/src/components/Button.jsx

 // @ts-nocheck
+import { useCallback } from 'react'
 import styled from 'styled-components'
 
 export default function Button (props) {
-  const { icon, text } = props
-  return <Wrapper>
+  const { icon, text, onClick } = props
+
+  const clickButton = useCallback(() => {
+    onClick && onClick()
+  }, [])
+
+  return <Wrapper onClick={clickButton}>
     {text}
     <span>{ icon }</span>
   </Wrapper>

swlab-main/src/components/Card.jsx

 // @ts-nocheck
+import { useCallback } from 'react'
 import styled from 'styled-components'
 import Backdrop from './Backdrop'
 import Button from './Button'
@@ -6,6 +7,10 @@ import Button from './Button'
 export default function Card (props) {
   const { title, subTitle, mainDesc, subDesc } = props
 
+  const onMovePage = useCallback((product) => () => {
+    window.location.href = `https://swlab.bwg.co.kr/docs/${product}`
+  }, [])
+
   return <Scene>
     <FlipCard>
       <CardFace className='front'>
@@ -25,7 +30,7 @@ export default function Card (props) {
               </Title>)
             }
           </div>
-          <Button text='Learn more'/>
+          <Button onClick={onMovePage(title.toLowerCase())} text='Learn more'/>
         </Overlay>
       </CardFace>
     </FlipCard>

swlab-main/src/components/Nav.jsx

 // @ts-nocheck
+import { useCallback } from 'react'
 import styled, { keyframes } from 'styled-components'
 
 export default function Nav () {
+
+  const onMoveDocPage = useCallback(() => {
+    window.location.href = 'https://swlab.bwg.co.kr/docs'
+  }, [])
+
   return (<Menu>
     <MenuItem><p>Blog</p></MenuItem>
-    <MenuItem><p>Documentation</p></MenuItem>
+    <MenuItem onClick={onMoveDocPage}><p>Documentation</p></MenuItem>
   </Menu>)
 }