wotta / woutervm_next

My personal website build on Next.js and Strapi headless CMS.

Hi there 👋

woutervm_next's Issues

Implement the new endpoint to get the navigation items

Created a new content for navigation items.

We still need to implement it on the nextjs side.

Implement protected blog posts.

When a password has been added to the blog post in question the frontend should do the following things.

• Filter out the blog post from the index list.
• When going directly to the correct slug a password field should need to be filled.
• An api call needs to be done to the api route which
• The api route should fetch the specified blog post and check if the given password is correct based on the provided password by the post.

This is not a foolproof way to "hide" blog posts but at least it helps a bit.

Rewrite website to NextUI 2

https://nextui.org/blog/nextui-v2

Tailwind dark regex

((\s)?dark:(hover:|focus:)?(\w*-\w*(-\d*)?))

Remove console logs in frontend folder

Create message sharing functionality

I want to create message sharing functionality that can be used to share information between me and other people in a somewhat secure way.

• Create collection type
• Hook into saving and updating hooks to encrypt the data
• A custom key should be generated to encrypt said data
• Create options to automatically delete the message
• Create frontend page to create message
• Create page to view message that needs a key to be shown

—

Created via Raycast

Setup Github actions

Create app.json

Follow link:

https://dashboard.heroku.com/apps/wotta-content-management/app-json

Create quick links page

Create a simple quick links page that uses the social media api endpoint

• Create custom field that can be used for fontawesome free icons.

Create footer component

<footer class="container prose prose-pink prose-sm sm:prose-lg lg:prose-lg xl:prose-2xl mx-auto w-full p-8">
    <div class="fluid-container text-xs">
        © 2020  - 2021 woutervm.com
                    -
                            <a href="https://www.twitter.com/wottavm" rel="noopener" aria-label="woutervm.com on Twitter" target="_blank">Twitter</a>
                            <a href="https://www.github.com/wotta" rel="noopener" aria-label="woutervm.com on Github" target="_blank">Github</a>
                            <a href="https://www.linkedin.com/in/wouter-van-marrum/" rel="noopener" aria-label="woutervm.com on Linkedin" target="_blank">Linkedin</a>
            
            </div>
</footer>

Remove reactMarkdown

Order blog posts from newest to oldest.

Implement knowledge graph JSON-ld seo component

add d2 core calculator

Create blog content type

Update the bootstrap.js file so it works for new installs.

The bootstrap file can be found here:

backend/src/bootstrap.js.

This file holds an pragmatic strapi seeder that is used to import the base data for this project.

Implement search functionality for finding blog posts.

Add descriptive title and description to blog page

Add Bionic Reading option for blog posts

Tweet with additional information: https://twitter.com/juanbuis/status/1526900107379105793

https://bionic-reading.com/faster-better-focused-reading/

Create heroku script

Fix PascalCase error for seo component

Getting the following error which seems to be incorrect.

[develop:frontend] SeoBasic
[develop:frontend] Warning: <SeoBasic /> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements.
[develop:frontend]     at SeoBasic
[develop:frontend]     at head
[develop:frontend]     at Head (webpack-internal:///./node_modules/next/dist/pages/_document.js:252:5)
[develop:frontend]     at html
[develop:frontend]     at Html (webpack-internal:///./node_modules/next/dist/pages/_document.js:241:29)

Below is the component that is being called:

const SeoBasic = ({ seo }) => {
  console.log(seo)
  return (
    <>
      {seo.title && (
        <>
          <title>{seo.title}</title>
        </>
      )}
    </>
  )
}

export default SeoBasic

Implement resume page and "certificate" page

to make it easier it would be beneficial to have a resume page.

Additionally it would be nice to have a certificate page where I can share information about "certifications" that I have.

Implement vercel/og package

Use the following package to generate better opengraph images.

https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation

Tweet RSS sync

Use the Twitter API to create an RSS feed of all my tweets.

—

Created via Raycast

Add Codespace setup

Implement NextJS Font Package

Read more documentation here: https://nextjs.org/docs/basic-features/font-optimization

—

Created via Raycast

Create social media post sharing functionality

With all the things going on with Twitter it would be a nice thing to make use of multiple social media to share posts that are written in the backend.

Will create an experimental feature where I can connect multiple sources which I can post towards.
When a post has been shared it will also be shared on a timeline on the website with links where the posts has been shared.

Todos:

• Create new collection
• Setup hooks
• Create new services
• Implement logic to publish social media post

Update read more link text for blog posts

Auto deploy strapi

Add pre-commit to project

Add new favicon for website.

Upgrade strapi version

Currently the admin is running version 4.0.3 but I want to run version 4.4.3.

To do this the dependencies need to be upgraded. The backend must be intact when the change is submitted.

Fix navigation dropdown

Currently there have been some changes that are breaking the dropdown navigation on mobile.

This should be an easy fix.

Allow strapi plugin images

dl.airtable.com

Implement Shiki when I want to share code on my blog.

https://github.com/shikijs/shiki

Add tooling page

https://webhook.site/

Rewrite website to use flowbite components

To make the website a bit nicer I want to use flowbite for ui components so it makes it a bit easier to develop new types of pages.

• flowbite

Enable weekly version update using dependabot

Twitter Card Is Not Included In Head Tags

Somehow the social images are not being included in the head tag after publishing blog post.