Website built with React and Nextjs.

Sass for styling.

React icons for icons.

MDX turn .mdx files into html.

Gray-matter gets the meta data out of .mdx files

npm install
yarn install
npm run dev
yarn dev

needs node v14

Also make sure your linter is error-free with npm run lint or yarn lint

Deployment should be managed by the pipeline (npm run deploy or yarn deploy)

Commit and Push your changes to master. This will trigger Github Action and deploy the changes to gh-pages.

• add new projects (kineval, todolist?)
• shorten cv old web experience? add senior dev? new skills to filter?
• optimize images with script
• review images (avoid bg-img, use different resolutions: https://dev.to/builderio/optimal-images-in-html-5bg9)
• review design: https://anthonyhobday.com/sideprojects/saferules/

1.5

• metrics animation? Number of projects/sites/hours/languages/experience/soft-skills
• back to top button

X.X

• add more images of features/pages?

Blog posts

• firebase series: rules, cloud fx, diff env., backup
• react advanced?
• use prism in your nextjs markdown ( scss)
• css posts: dropdown, input with label animation
• use mdx with nextjs
• local ssg site with python
• props to parent/child
• md to html
• SSG vs SSR
• dev.to

• Create a new .mdx file under /pages/blog
• Give it a powerful name
• Add the meta data at the very top

  ---
  title: 'Post title'
  intro: 'Post longer title or intro'
  published: '2022-12-30'
  modified: '2022-12-31'
  categories: 'next.js, css, tutorial, analytics'
  ---
  

• Write the post with keywords, speaking with we, code examples and a final result on codepen or codesandbox
• Review spell on https://languagetool.org/
• Create blog post image: https://codepen.io/beumsk/full/wvjYygY and upload in /public/images/posts

• Add en entry in data/projects.js

  {
    slug: 'project-title',
    title: 'Project title',
    link: '/projects/project-title',
    intro: 'Project intro text',
    current: 'https://www.current-link.com/',
    past: 'https://web.archive.org/web/xxxxxxxxxxx/https://past-link.com/',
    img: '/images/projects/project-title.jpg',
    screen: '/images/projects/project-title-screen.png',
    modified: '2022-12-31',
    tech: ['tech1', 'tech2'],
    chall: [
      'First challenge',
      'Second challenge',
    ],
    homepage: true,
    type: 'pro',
  },
  

• Create an optimized miniature image and upload in /public/images/projects
• Create an optimized full size screenshot of live version and upload in /public/images/projects

• Add en entry in data/projects.js

  {
    slug: 'project-title',
    title: 'Project title',
    link: '/projects/project-title',
    intro: 'Project intro text',
    img: '/images/projects/project-title.jpg',
    pen: 'xxxxxx',
    sandbox: 'sandbox-title-xxxxxx',
    modified: '2022-12-31',
    tech: ['tech1', 'tech2'],
    chall: [
      'First challenge',
      'Second challenge',
    ],
    homepage: true,
    type: 'perso',
  }
  

• Create an optimized miniature image and upload in /public/images/projects

Easy web analytics without tracking of personal data at https://beumsk.goatcounter.com/