wonism / gatsby-advanced-blog

Gatsby starter for advanced blog

Hi, I'm Jaewon 👋

📝 Blog 🐦 Twitter 💌 Mail

---

• 🧑🏻‍💻 I'm currently working at @tossinvest as Front-end developer.
• 💙 I like React and RxJS.
• 📫 How to reach me: [email protected]

gatsby-advanced-blog's Issues

Style Components do not work even after adding them to peer review and installing.

I used to get warn error Style Components was not in peer. So, I change the location to peer review as below.

"peerDependencies": {
"gatsby": "^2.0.0-beta.19",
"react": "^16.4.0",
"prop-types": "^15.0.0",
"styled-components": "^3.3.3"
},

Then, I install styled-components. The warning went away, but the component's css is absent in deployment and gatsby serve.

Header not fixed on chrome or firefox

The header is fixed in Safari on desktop and mobile but not in chrome or firefox.

Pipeline operator error messages on build

Following the readme for getting started, the build fails with error message
Support for the experimental syntax 'pipelineOperator' isn't currently enabled.

Should I change the babelrc or preset (or something) to work around this concern?

react-hot-loader version 4.8.1 no longer exists

package-lock.json needs an update because [email protected] does not exist

Robots exclusion standard missing

Error 404 returned for robots.txt file

Tags are overflowed in card

Post contents don't have readability

npm run dev throws errors

Hi! I happened upon your starter for gatsby and I really want to use it. Unfortunately, I keep getting errors. I have confirmed that I'm able to run gatsby using the default starter.

I downgraded gatsby to the latest stable version. When I run npm run dev
I get this error:

> gatsby develop

success delete html and css files from previous builds — 0.008 s
success open and validate gatsby-config — 0.005 s
success copy gatsby files — 0.015 s
success onPreBootstrap — 0.608 s
success source and transform nodes — 0.266 s
success building schema — 0.509 s
success createLayouts — 0.009 s
success createPages — 0.001 s
success createPagesStatefully — 0.024 s
success onPreExtractQueries — 0.001 s
success update schema — 0.143 s
warning There are conflicting field types in your data. GraphQL schema will omit those fields.
SitePluginConnection.packageJson.author:
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/CategorizedList.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/Portfolios.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/Portfolio.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/List.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/TaggedList.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/Post.jsx" will not be run.
warning The GraphQL query in the non-page component "/Users/anthkris/knanthony.com/knanthony.com/knanthony-business/src/templates/Resume.jsx" will not be run.
Queries are only executed for Page or Layout components. Instead of a query,
co-locate a GraphQL fragment and compose that fragment into the query (or other
fragment) of the top-level page or layout that renders this component. For more
info on fragments and composition see: http://graphql.org/learn/queries/#fragments
success extract queries from components — 0.226 s
success run graphql queries — 0.035 s
success write out page data — 0.005 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.001 s

info bootstrap finished - 5.747 s

error UNHANDLED EXCEPTION


  TypeError: Cannot read property 'setWebpackConfig' of undefined
  
  - gatsby-node.js:13 Object.exports.modifyWebpackConfig
    [knanthony-business]/[gatsby-plugin-less]/gatsby-node.js:13:36
  
  - api-runner-node.js:110 runAPI
    [knanthony-business]/[gatsby]/dist/utils/api-runner-node.js:110:36
  
  - api-runner-node.js:187 
    [knanthony-business]/[gatsby]/dist/utils/api-runner-node.js:187:33
  
  - map.js:27 
    [knanthony-business]/[async]/internal/map.js:27:9
  
  - eachOfLimit.js:66 replenish
    [knanthony-business]/[async]/internal/eachOfLimit.js:66:17
  
  - eachOfLimit.js:50 iterateeCallback
    [knanthony-business]/[async]/internal/eachOfLimit.js:50:17
  
  - onlyOnce.js:12 
    [knanthony-business]/[async]/internal/onlyOnce.js:12:16
  
  - map.js:29 
    [knanthony-business]/[async]/internal/map.js:29:13
  
  - util.js:16 tryCatcher
    [knanthony-business]/[bluebird]/js/release/util.js:16:23
  
  - nodeify.js:23 Promise.successAdapter
    [knanthony-business]/[bluebird]/js/release/nodeify.js:23:30
  
  - promise.js:566 Promise._settlePromise
    [knanthony-business]/[bluebird]/js/release/promise.js:566:21
  
  - promise.js:606 Promise._settlePromiseCtx
    [knanthony-business]/[bluebird]/js/release/promise.js:606:10
  
  - async.js:138 Async._drainQueue
    [knanthony-business]/[bluebird]/js/release/async.js:138:12
  
  - async.js:143 Async._drainQueues
    [knanthony-business]/[bluebird]/js/release/async.js:143:10
  
  - async.js:17 Immediate.Async.drainQueues
    [knanthony-business]/[bluebird]/js/release/async.js:17:14
  


npm ERR! Darwin 17.5.0
npm ERR! argv "/usr/local/bin/node" "/Users/anthkris/.nvm/versions/node/v6.6.0/bin/npm" "run" "dev"
npm ERR! node v9.6.1
npm ERR! npm  v3.10.7
npm ERR! code ELIFECYCLE
npm ERR! [email protected] dev: `gatsby develop`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] dev script 'gatsby develop'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the gatsby-advanced-blog package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     gatsby develop
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs gatsby-advanced-blog
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls gatsby-advanced-blog
npm ERR! There is likely additional logging output above.

I'm using:

• npm 3.10.7
• node 9.6.1
• Mac OS 10.13.4
• gatsby 1.9.270

resume/ module parse failed assigning to rvalue

Is this a concern? How should I work around

warning in ./src/resources/resume/index.md
Module parse failed: Assigning to rvalue (1:2)
You may need an appropriate loader to handle this file type.

The print button prints a blank page.

I tried fixing the bug. I thought the issue was javascript related, so I tried downloading the react-to-print library. I tried with the dangerouslySet div with no luck, and then I tried with a regular div with the same bug. I keep getting the warning does not support changing store on the fly.

In resume/index.jxs,

import ReactToPrint from "react-to-print";

render() {
    const { data, printPage } = this.props;
    const resume = get('markdownRemark')(data);
    **const printButton = (
      <button type="button">
        <FaPinrt />
        Print
      </button>
    );**
    return (
      <Wrapper>
        <Clearfix>
          <Helmet>
            <title>
              WONISM | RESUME
            </title>
            <meta name="og:title" content="WONISM | RESUME" />
          </Helmet>
          <Clearfix>
            **<ReactToPrint
              trigger={() => <a href="#">Print this out!</a>}
              content={() => this.ref}
            />
            {printButton}**
          </Clearfix>
          <BasicInformation>
            <img
              src={profileUrl.default}
              alt=""
              width="120"
              height="120"
            />
            <h1>
              wonism
            </h1>
            <p>
              [email protected]
            </p>
          </BasicInformation>
          <SocialInformation>
            <a
              href="https://github.com/wonism"
              target="_blank"
              rel="noreferrer noopener"
            >
              <FaGithub />
            </a>
            <a
              href="https://twitter.com/j1ism"
              target="_blank"
              rel="noreferrer noopener"
            >
              <FaTwitter />
            </a>
            <a
              href="https://www.facebook.com/j1.chic"
              target="_blank"
              rel="noreferrer noopener"
            >
              <FaFacebook />
            </a>
            <a
              href="https://www.linkedin.com/in/wonism/"
              target="_blank"
              rel="noreferrer noopener"
            >
              <FaLinkedin />
            </a>
          </SocialInformation>
          <MDInformation>
            <div
              id="Text"
              ref={(mdWrapper) => { this.$mdWrapper = mdWrapper; }}
              dangerouslySetInnerHTML={{ __html: get('html')(resume) }}
            />

            **<div ref={(mdWrapper) => { this.ref = mdWrapper; }}>
              <p> Non-dangerouslySetHTML</p>
            </div>**
          </MDInformation>
        </Clearfix>
      </Wrapper>
    );
  }
}

Add copy button in section of codes

Add image into post

Question: What is const getAppSubState = get('app'); storing exactly in store/app/selectors.js line 4

I am trying to manipulate code to create a interest page for myself. I am not sure lodash/fp "get" is doing here. When I look at the docs https://lodash.com/docs/4.17.10#get, it specifically states the get function takes two arguments. You the get function in store/app/selectors.js and components/resume/index.jsx like this. What are you storing in these variables using the get function, and how are you only using one argument.

Add border-radius to profile image

Gatsby links needs to be update to new format

For example,

import Link from 'gatsby-link';

to,

import { Link } from 'gatsby'

as documentation
https://next.gatsbyjs.org/docs/migrating-from-v1-to-v2/#import-link-from-gatsby

Write page

ref https://developer.github.com/v3/repos/contents/#create-a-file