{"version":3,"file":"component---src-pages-develop-index-jsx-6def4939a51f662c7deb.js","mappings":"8KAIMA,EAAkB,SAAC,GAAqB,IAAnBC,EAAkB,EAAlBA,YACzB,OAAO,uBAAKC,UAAU,mBAAmBD,K,iGCErCE,EAAY,SAAC,GAAe,IAAbC,EAAY,EAAZA,MACbC,GAAaC,EAAAA,EAAAA,MACXC,GAAWC,EAAAA,EAAAA,MAAXD,OACR,OACE,uBAAKL,UAAU,cACb,uBAAKA,UAAU,0BACb,gBAAC,EAAAO,EAAD,CAAaC,MAAOL,EAAYM,IAAKJ,KAEvC,gBAAC,IAAD,CAAOH,MAAOA,O,kJCNdQ,EAAY,SAAC,GAAe,IAAbC,EAAY,EAAZA,MAEnB,GAAoCC,EAAAA,EAAAA,UAAS,MAAtCC,EAAP,KAAmBC,EAAnB,KACA,GAAsCF,EAAAA,EAAAA,UAAS,GAAxCG,EAAP,KAAoBC,EAApB,KACA,GAAoCJ,EAAAA,EAAAA,UAAS,IAAtCK,EAAP,KAAmBC,EAAnB,MAMAC,EAAAA,EAAAA,YAAU,WAmCRD,GAAc,SAACE,GACb,MAAM,GAAN,eAAWA,IAAX,QAnCkBC,EAVF,EAWTV,EAAMW,MAAMP,EAAaA,EAAcM,GAAME,KAAI,SAACC,EAAMC,GAC7D,IAAQC,EAAuBF,EAAvBE,mBACR,EAAwBF,EAAKG,oBAArBC,EAAR,EAAQA,GAAIC,EAAZ,EAAYA,QACJC,EAASN,EAAKG,oBAAoBI,OAAlCD,KACR,EAAwBN,EAAKG,oBAAoBK,YAAzC9B,EAAR,EAAQA,MAAO+B,EAAf,EAAeA,KACTC,EAXW,SAACJ,GACtB,OAAOA,EAAKK,MAAM,KAAKb,MAAM,GAAI,GAAGc,KAAK,KAUhBC,CAAeP,KAASQ,EAAAA,EAAAA,MAC7C,OACE,gBAAC,EAAAC,KAAD,CACEC,IAAKZ,EACLa,GAAE,IAAMf,EAAqBI,EAC7BY,MAAO,CAAEC,MAAO,YAEhB,uBACEC,IAAWC,IAANpB,EAAwBX,EAAgB,KAC7Cd,UAAU,uBAEV,uBAAKA,UAAU,mBAAmBE,GAClC,uBAAKF,UAAU,kBACb,uBAAKA,UAAU,eAAc8C,EAAAA,EAAAA,GAAWZ,IACxC,uBAAKlC,UAAU,cAAf,KACA,gBAAC,IAAD,CAAMA,UAAU,iBAAiBiC,KAAMA,KAEzC,uBACEjC,UAAU,oBACV+C,wBAAyB,CACvBC,OAAQnB,aA1BH,IAACR,OAqCnB,CAACN,IAEJ,IAAMkC,EAAW,mCAAG,aAAgBC,GAAhB,wEAAQC,EAAR,MACRC,iBACRpC,GAAe,SAACqC,GAAD,OAASA,EAnDR,KAoDhBH,EAASI,UAAUH,EAAMI,SAHT,2CAAH,wDAkBjB,OAXApC,EAAAA,EAAAA,YAAU,WACR,IAAI+B,EAOJ,OANIrC,IACFqC,EAAW,IAAIM,qBAAqBP,EAAa,CAC/CQ,UAAW,MAEJC,QAAQ7C,GAEZ,kBAAMqC,GAAYA,EAASS,gBACjC,CAAC9C,IAEG,gCAAGI,K,0HC1CZ,UAvBc,SAAC,GAAc,IAAZ2C,EAAW,EAAXA,KACTC,GAAmBvB,EAAAA,EAAAA,MACnBwB,GAAWhB,EAAAA,EAAAA,GAAWe,GACtBlD,EAAQiD,EAAKjD,MAAMoD,MACnBC,EAAaJ,EAAKI,WAAWD,MAInC,OACE,gBAAC,IAAD,CAAQE,QAASJ,GACf,gBAAC,IAAD,CAAK3D,MAAO4D,IACZ,gBAAC,IAAD,CAASE,WAAYA,EAAYE,oBAAqBL,IACtD,gBAAC,IAAD,CAAW3D,MAAO4D,IAClB,gBAAC,IAAD,CAAiB/D,YAPnB,oDAQE,gBAAC,IAAD,CAAWY,MAAOA","sources":["webpack://gatsby-starter-oasis/./src/components/PageDescription/index.jsx","webpack://gatsby-starter-oasis/./src/components/PageTitle/index.jsx","webpack://gatsby-starter-oasis/./src/components/PostItems/index.jsx","webpack://gatsby-starter-oasis/./src/pages/develop/index.jsx"],"sourcesContent":["import React from 'react'\nimport PropTypes from 'prop-types'\nimport './index.scss'\n\nconst PageDescription = ({ description }) => {\n return
{description}
\n}\n\nPageDescription.propTypes = {\n description: PropTypes.string,\n}\n\nexport { PageDescription }\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { GatsbyImage } from 'gatsby-plugin-image'\nimport { useProfileImg, useMetadata } from '../../hooks'\nimport { Title } from '../Elements'\nimport './index.scss'\n\nconst PageTitle = ({ title }) => {\n const profileImg = useProfileImg()\n const { author } = useMetadata()\n return (\n
\n
\n \n
\n \n </div>\n )\n}\n\nPageTitle.propTypes = {\n title: PropTypes.string,\n}\n\nexport { PageTitle }\n","import React, { useState, useEffect } from 'react'\nimport { useTopLevelPathName } from '../../hooks'\nimport { capitalize } from '../../utils/capitalize'\nimport PropTypes from 'prop-types'\nimport { Link } from 'gatsby'\nimport { Date } from '../Elements'\n\nimport './index.scss'\n\nconst PostItems = ({ posts }) => {\n const baseOfSlice = 5\n const [targetElem, setTargetElem] = useState(null)\n const [targetIndex, setTargetIndex] = useState(0)\n const [renderList, setRenderList] = useState([])\n\n const slugToCategory = (slug) => {\n return slug.split('/').slice(1, -2).join('/')\n }\n\n useEffect(() => {\n const slicedItem = (base) => {\n return posts.slice(targetIndex, targetIndex + base).map((post, i) => {\n const { sourceInstanceName } = post\n const { id, excerpt } = post.childMarkdownRemark\n const { slug } = post.childMarkdownRemark.fields\n const { title, date } = post.childMarkdownRemark.frontmatter\n const categoryName = slugToCategory(slug) || useTopLevelPathName()\n return (\n <Link\n key={id}\n to={`/${sourceInstanceName}${slug}`}\n style={{ color: 'inherit' }}\n >\n <div\n ref={i === baseOfSlice - 1 ? setTargetElem : null}\n className=\"post-item-container\"\n >\n <div className=\"post-item-title\">{title}</div>\n <div className=\"post-item-info\">\n <div className=\"is-primary\">{capitalize(categoryName)}</div>\n <div className=\"is-primary\">|</div>\n <Date className=\"post-item-date\" date={date} />\n </div>\n <div\n className=\"post-item-excerpt\"\n dangerouslySetInnerHTML={{\n __html: excerpt,\n }}\n />\n </div>\n </Link>\n )\n })\n }\n setRenderList((list) => {\n return [...list, ...slicedItem(baseOfSlice)]\n })\n }, [targetIndex])\n\n const onIntersect = async ([entry], observer) => {\n if (entry.isIntersecting) {\n setTargetIndex((idx) => idx + baseOfSlice)\n observer.unobserve(entry.target)\n }\n }\n\n useEffect(() => {\n let observer\n if (targetElem) {\n observer = new IntersectionObserver(onIntersect, {\n threshold: 0.3,\n })\n observer.observe(targetElem)\n }\n return () => observer && observer.disconnect()\n }, [targetElem])\n\n return <>{renderList}</>\n}\n\nPostItems.propTypes = {\n posts: PropTypes.arrayOf(PropTypes.object),\n}\n\nexport { PostItems }\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { graphql } from 'gatsby'\nimport { Layout } from '../../components/Layout'\nimport { Seo } from '../../components/Seo'\nimport { Sidebar } from '../../components/Sidebar'\nimport { PostItems } from '../../components/PostItems'\nimport { PageDescription } from '../../components/PageDescription'\nimport { PageTitle } from '../../components/PageTitle'\nimport { capitalize } from '../../utils/capitalize'\nimport { useTopLevelPathName } from '../../hooks'\n\nconst Index = ({ data }) => {\n const topLevelPathName = useTopLevelPathName()\n const pageName = capitalize(topLevelPathName)\n const posts = data.posts.nodes\n const directorys = data.directorys.nodes\n const description =\n '개발을 하면서 필요하다고 생각하는 개념 및 문제 해결과정에 대한 글을 담고 있습니다.'\n\n return (\n <Layout belongs={topLevelPathName}>\n <Seo title={pageName} />\n <Sidebar directorys={directorys} currentCategoryName={topLevelPathName} />\n <PageTitle title={pageName} />\n <PageDescription description={description} />\n <PostItems posts={posts} />\n </Layout>\n )\n}\n\nIndex.propTypes = {\n data: PropTypes.object,\n}\n\nexport default Index\n\nexport const qurey = graphql`\n query DevelopPage {\n directorys: allDirectory(\n filter: {\n sourceInstanceName: { eq: \"develop\" }\n relativeDirectory: { regex: \"/^$|^\\\\.\\\\.$/\" }\n }\n sort: { order: DESC, fields: relativeDirectory }\n ) {\n nodes {\n id\n name\n }\n }\n posts: allFile(\n filter: {\n sourceInstanceName: { eq: \"develop\" }\n absolutePath: { regex: \"/.md$/\" }\n }\n sort: { fields: childrenMarkdownRemark___frontmatter___date, order: DESC }\n ) {\n nodes {\n sourceInstanceName\n childMarkdownRemark {\n frontmatter {\n date(formatString: \"MMMM DD , YYYY\")\n title\n }\n fields {\n slug\n }\n excerpt(truncate: true)\n id\n }\n }\n }\n }\n`\n"],"names":["PageDescription","description","className","PageTitle","title","profileImg","useProfileImg","author","useMetadata","G","image","alt","PostItems","posts","useState","targetElem","setTargetElem","targetIndex","setTargetIndex","renderList","setRenderList","useEffect","list","base","slice","map","post","i","sourceInstanceName","childMarkdownRemark","id","excerpt","slug","fields","frontmatter","date","categoryName","split","join","slugToCategory","useTopLevelPathName","Link","key","to","style","color","ref","baseOfSlice","capitalize","dangerouslySetInnerHTML","__html","onIntersect","observer","entry","isIntersecting","idx","unobserve","target","IntersectionObserver","threshold","observe","disconnect","data","topLevelPathName","pageName","nodes","directorys","belongs","currentCategoryName"],"sourceRoot":""}