How to store static content for portfolio page

Unanswered

Oriental chestnut gall wasp posted this in #help-forum

Oriental chestnut gall waspOP

2024-02-03T21:51:34.000Z

I'm curious on how to store the content for portfolio page. Currently I'm using typescript files to annotate typesafe objects representing my content, which is then displayed on different sections. Wonder if it would be beneficial here to use a Cms here, since my current approach isn't really flexible and when it comes to i18n it might be confusing to translate the content inside the ts file with a dictionary, that's probably written inside a json file.

18 Replies

aardani

2024-02-04T02:20:23.000Z

why not just do content.ts and export a const variable in there?

Oriental chestnut gall waspOP

2024-02-04T02:35:17.000Z

I already did. But I revised my structure a lot since I wrote the question and it definitely looks better now.
But I'm still wondering how to store e.g. a paragraph that has several words that are embedded links. Should I store the whole jsx element inside the object or separate the paragraph into text and link artifacts which are then stored in an array?

@Oriental chestnut gall wasp I already did. But I revised my structure a lot since I wrote the question and it definitely looks better now. But I'm still wondering how to store e.g. a paragraph that has several words that are embedded links. Should I store the whole jsx element inside the object or separate the paragraph into text and link artifacts which are then stored in an array?

aardani

2024-02-04T02:36:41.000Z

e.g. a paragraph that has several words that are embedded links.

Example?

You should look into Markdown

https://nextjs.org/docs/app/building-your-application/configuring/mdx

@aardani > e.g. a paragraph that has several words that are embedded links. Example?

Oriental chestnut gall waspOP

2024-02-04T02:39:05.000Z

ts 
         Thriving on a diverse array of{' '}
          <Link
            href='/techstack'
            className='border-b-2 transition duration-200 ease-in-out hover:border-b-2 hover:border-foreground'
          >
            cutting-edge technologies
          </Link>
          , I&apos;m eager to broaden my skills and embrace new{' '}
          <Link
            href='/challenges'
            className='border-b-2 transition duration-200 ease-in-out hover:border-b-2 hover:border-foreground'
          >
            challenges
          </Link>

Something like this is still hard coded and I prefer storing this somewhere else for easier maintenance

aardani

2024-02-04T02:39:31.000Z

yeah

CMS is preferable but CMS can be quite complex

if you want something simple i suggest checking out MDX

Oriental chestnut gall waspOP

2024-02-04T02:41:25.000Z

But do you mean a MDX file storing the content or a MDX file rendered as the page?

aardani

2024-02-04T02:42:34.000Z

both

you can store your content in an MDX file, then import them to the page

Oriental chestnut gall waspOP

2024-02-04T02:43:52.000Z

You have a small example for that?

@aardani https://nextjs.org/docs/app/building-your-application/configuring/mdx

aardani

2024-02-04T02:44:36.000Z

here?

Oriental chestnut gall waspOP

2024-02-04T03:05:01.000Z

Okay, I see the benefit for e.g blog posts, that differ in the layout. But when I have components their only job is to map over my content arrays and give me back renderable jsx elements I don't know if this is beneficial in any way.

@Oriental chestnut gall wasp Okay, I see the benefit for e.g blog posts, that differ in the layout. But when I have components their only job is to map over my content arrays and give me back renderable jsx elements I don't know if this is beneficial in any way.

aardani

2024-02-04T06:24:00.000Z

thats not what you are asking

you are asking with paragraph and links

thats what the mdx are for