feat: `card/blogpost.html` shortcode and `assets/js/blog.js` dynamic article fetching #72

JeremyTubongbanua · 2022-06-20T23:25:14Z

What this PR is for:

Create card/blogpost.html shortcode
Add a description and example to the contribute page for using this shortcode.
Dynamic JS blog fetching (medium, hashnode, linkedin)
Put dynamic fetching + shortcode together

JeremyTubongbanua · 2022-06-21T00:15:48Z

Design drafts
https://www.figma.com/file/4DRFUwAXKZy8kP68jzEHrs/Untitled?node-id=0%3A1

JeremyTubongbanua · 2022-06-26T17:33:25Z

Table

card/blogpost shortcode Preview (light)

card/blogpost shortcode Preview (dark)

{{< card/blogpost 
title="A little, big island" description="How someone from the small island of Bermuda found themselves in the Silicon Valley" author="Tyler Trott" 
href="https://medium.com/@tyler.trott/a-little-big-island-ae101eda7b06" 
img-src="https://miro.medium.com/max/700/1*C9s33bNRoPx5rV0cGhR3nw.png" 
target="_blank" 
>}}

…ports Medium articles for now

JeremyTubongbanua · 2022-06-29T17:45:39Z

@XavierChanth

I get this when trying to do node assets/js/articleFetch.js (See below)

> node assets/js/articleFetch.js

(node:21520) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
C:\Users\madiv\Desktop\GitHub\atsign.dev-3.0\assets\js\articleFetch.js:1
import fetch from 'node-fetch'; // https://stackoverflow.com/questions/48433783/referenceerror-fetch-is-not-defined
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1032:15)
    at Module._compile (node:internal/modules/cjs/loader:1067:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

Would it be bad to put "type": "module" in package.json?

I tried it on my machine and nothing seems to break when I run the website with npm run start.

JeremyTubongbanua · 2022-06-29T17:46:41Z

Also, here is the output of articleFetch.js if you were to run main(). But the main thing in that file is getItems() which creates JS Objects containing article data (like title, thumbnailUrl, author, date, description)

{
  title: 'Flutter Silicon Valley Meetup #2',
  pubDate: '2022-06-03 17:39:03',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/808/1*Co1A04JT4fhx961EIWYBOA.png',
  description: 'Hey Everyone! The team at Atsign recently hosted Flutter Silicon Valley’s second meetup! Flutter Silicon Valley is an event where the Flutter devel...'
}
{
  title: '@spacechat: Students Building for Social Privacy on Flutter',
  pubDate: '2022-04-20 18:47:05',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*TR4Vm8eUZZfnNU5Gdztcgg.png',
  description: 'Introduction Tired of social media companies like Facebook, YouTube, and Twitter messing with our data? Meet Gefei Zhang, an entrepreneur and stude...'
}
{
  title: '“Hamming It Up” with The @ Company’s Colin Constable, Creator of CATWEB Mobile App For and By the…',
  pubDate: '2022-04-07 23:02:54',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*fHc301_O-Ih1wBeOhWaM3g.png',
  description: '“Hamming It Up” with The @ Company’s Colin Constable, Creator of CATWEB Mobile App For and By the Ham Radio Community. Colin Constable, AI6BH When ...'
}
{
  title: 'Developers, it’s time to #flipoffsocialmedia',
  pubDate: '2021-12-05 00:10:11',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*TSLgiZSrKxKWg9V3',
  description: 'How’s that for a title? I had to use that title so that it would show up in your social media feeds, and that is exactly the point of this post. If...'
}
{
  title: 'Building Flutter apps with no backend?',
  pubDate: '2021-10-19 13:28:55',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*9DJJ43R8XuSJmkAa',
  description: 'It’s possible with the free &amp; open-source @platform. As developers, we have to make so many decisions when we start a new project: What databas...'
}
{
  title: 'The @ Company Core Values',
  pubDate: '2021-07-20 18:40:07',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*3hv7a2qKNzDbH-EKKcTnpA.png',
  description: 'At The @ Company, we are building a flat organization, where decisions that impact the success of the company will be made at every level. As a 
gro...'
}
{
  title: 'Ask the Founders: Storage &amp; Memory &amp; Servers, Oh My!',
  pubDate: '2021-05-29 00:03:38',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*9LT2hxetIEVsvQrQmijmSQ.jpeg',
  description: 'Frequently Asked Questions about our private, open source protocol Photo by Fredy Jacob on UnsplashThe @platform is a clever abstraction machine. P...'
}
{
  title: 'Ask the Founders: Breaking Down the @platform',
  pubDate: '2021-05-26 05:25:58',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*9WDXtWH1sA53JsH4oTg4dQ.jpeg',
  description: 'Frequently Asked Questions about our private, open source protocol Photo by Matt Palmer on UnsplashWhen it comes to understanding the @platform 
and...'
}
{
  title: 'If you love your customers, set them free',
  pubDate: '2021-05-20 18:00:02',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*OietD5Qtl-OYR_CcQ_6llg.jpeg',
  description: 'A post-cookie-era CRM strategy and marketing mantra While watching a show on Animal Planet with my kids, I experienced something I haven’t in years...'
}
{
  title: 'Ask the Founders: What is the @platform?',
  pubDate: '2021-05-19 21:37:46',
  author: 'Atsign',
  thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*aP8VGvdhn58IETvw',
  description: 'Frequently Asked Questions about our private, open source protocol Image from UnsplashPart of the great thing about working at The @ Company is 
tha...'
}

JeremyTubongbanua · 2022-06-29T17:51:59Z

Also,, how can I get started using the code?

JeremyTubongbanua · 2022-06-29T19:39:10Z

Sample of 2 recent commits (053f543 and fe5362b)

Cards dynamically adjusts to window nicely.

JeremyTubongbanua · 2022-07-01T17:32:31Z

@XavierChanth

Will need help with bootstrap when we meet up again.

(1) description too short, big white space in the middle
(4) title is too long,, resulting in the top image to be cut
(7) thumbnail image is short in height,, a lot of white space

JeremyTubongbanua · 2022-07-01T17:34:16Z

Personal tasks to be done

Fetch hashnode articles
Convert publishDate to a presentable date string
~~Trim titles to be a certain max length (similar to how we trim description)~~ Trim title & description using CSS
Make all images the same size (maybe scale the images?)
Use blog.js to dynamically render the shortcodes using JavaScript

XavierChanth · 2022-07-01T18:05:11Z

Rather than trimming the descriptions programatically, you can do it through css, and let the cards automatically cut the descriptions to an appropriate height that fills remaining space when available.

JeremyTubongbanua · 2022-07-01T18:46:17Z

Rather than trimming the descriptions programatically, you can do it through css, and let the cards automatically cut the descriptions to an appropriate height that fills remaining space when available.

Interesting!
I will definitely look into that.

JeremyTubongbanua · 2022-07-01T18:55:14Z

I've found some code for fetching blog posts from a specific user on hashnode.

Major problem is the code takes the published blogs from the user not the blog (https://blog.atsign.dev/). So what I can do instead is extract the blogs from all the Atsign employees but this is not a permanent solution.

const fetchArticles = async (query, variables = {}) => {
        const data = await fetch("https://api.hashnode.com/", {
          method: "POST",
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify({
            query,
            variables
          })
        });
        return data.json();
      }
       
    //   const username = `wildgreen`;
    //   const username = `cpswan`;
    //   const username = `Bahati365`;
      const username = `CynthiaPeter`;

    const page = 0;

      const articleQuery = `
      query GetUserArticles($page: Int!) {
              user(username: "${username}") {
                  publication {
                      posts(page: $page) {
                          title
                          brief
                          coverImage
                          slug
                      }
                  }
              }
          }
      `;
       
      fetchArticles(articleQuery, {page: 0})
        .then(result => {
          const articles = result.data.user.publication.posts;
        //   console.log(result);
          articles.forEach(article => {
            console.log(article);
          });
    });

Output

{
  title: 'What is an atsign and why you need one?',
  brief: 'Introduction\n' +
    'Following the questions, I got asked in person and even online, I am taking this opportunity to talk about what an @‎sign is and why you
 should get one.\n' +
    'First, it is pronounced as ‘at-sign’. An ‎@‎sign is a unique handle that functions a...',
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1653045960070/nE4qu0NBQ.png',
  slug: 'what-is-an-atsign-and-why-you-need-one'
}
{
  title: 'Deploying and Managing Your Machine Learning Pipeline with Terraform and Doppler',
  brief: 'Outline\n' +
    'Please complete in as much detail as possible.\n' +
    '\n' +
    'Introduction to ML pipeline\n' +
    'Brief intro to Terraform and doppler\n' +
    'Setting up Doppler\n' +
    'Installing Terraform and AWS to set up model infrastructure \n' +
    'Setting up an S3 Bucket on AWS\n' +
    'Deploying model us...',
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1637755006544/1_Mh5lD0w.jpeg',
  slug: 'deploying-and-managing-your-machine-learning-pipeline-with-terraform-and-doppler'
}
{
  title: 'Flutterflow celebrates one year Anniversary and over 60,000 Builders.🎉🎉🎉',
  brief: 'Flutterflow celebrates its First Anniversary and closes in on 60,000+ builders.\n' +
    "This may be the first time you're reading about Flutterflow or maybe the first time you're seeing it on your screen. But just on the 30th of October Flutterflow celebrate...",
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1636018340570/6jmyeUpJR.jpeg',
  slug: 'flutterflow-celebrates-one-year-anniversary-and-over-60000-builders'
}
{
  title: 'Most Common Questions About Technical Writing Answered',
  brief: 'In a previous article, you learned what technical writing is. Who is a technical writer? How to get started with technical writing 
and some basics. After the previous article, I received a couple of questions, and I thought instead of just answering ...',
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1633014066780/8pd2j1BFX.jpeg',
  slug: 'most-common-questions-about-technical-writing-answered'
}
{
  title: "A beginners' guide to get started with Technical Writing",
  brief: "In the past few months, I have spoken at events where I was asked 'how do I get started with technical writing?' Most recently, I received over 5 direct messages(DM's) on Twitter asking me how they can get started with technical writing. \n" +
    'This articl...',
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1632345513014/e-7JMBKJC.jpeg',
  slug: 'a-beginners-guide-to-get-started-with-technical-writing'
}
{
  title: 'Advantages of Using Flutter as A Cross-Platform Development tool.',
  brief: 'In the past 2 years, the software development community has recorded a great increase in the use of Google Flutter SDK. And as a result of this, we have more people asking questions and wondering why they should learn flutter as a tool for building c...',
  coverImage: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1632344771812/uD70tC6ID.jpeg',
  slug: 'advantages-of-using-flutter-as-a-cross-platform-development-tool'
}

…ions)

JeremyTubongbanua · 2022-07-01T23:38:10Z

Very important commit: `8d603b5`

2 functions:

getMediumItems() (Uses rss2json API to interpret medium.com/feed/${user} output)
getHashnodeItems() (Uses api.hashnode.com GraphQL API)

Limitations:

Medium - limited to 10 blogs (for some reason; like we discussed)
Hashnode - have to fetch from users (haven't found a way to fetch from https://blog.atsign.dev/)
- at the top of blog.js, you will see a list named HASHNODE_USERNAMES where a GraphQL query is run for each username
- cannot get link to blog itself. i couldn't find a way to get the link to the "Publication" in GraphQL, so the link is just to their user page on hashnode.

===================================================

Code

const result1 = await getMediumItems();
const result2 = await getHashnodeItems();
const together = [...result1, ...result2];
console.log(together);

Output

[
  {
    title: 'Flutter Silicon Valley Meetup #2',
    pubDate: '2022-06-03 17:39:03',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/808/1*Co1A04JT4fhx961EIWYBOA.png',
    description: 'Hey Everyone! The team at Atsign recently hosted Flutter Silicon Valley’s second meetup! Flutter Silicon Valley is an event where the Flutter developer community can get together and share in all t...',
    link: 'https://medium.com/flutter-community/flutter-silicon-valley-meetup-2-d792b43f7e28?source=rss-f779d31710de------2'
  },
  {
    title: 'atSpaceChat: Students Building for Social Privacy on Flutter',
    pubDate: '2022-04-20 18:47:05',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*TR4Vm8eUZZfnNU5Gdztcgg.png',
    description: 'Introduction Tired of social media companies like Facebook, YouTube, and Twitter messing with our data? Meet Gefei Zhang, an entrepreneur and student who is single handedly flipping the internet by...',
    link: 'https://medium.com/flutter-community/spacechat-students-building-for-social-privacy-on-flutter-183b1346cb82?source=rss-f779d31710de------2'
  },
  {
    title: '“Hamming It Up” with Atsign’s Colin Constable, Creator of CATWEB Mobile App For and By the…',
    pubDate: '2022-04-07 23:02:54',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*fHc301_O-Ih1wBeOhWaM3g.png',
    description: '“Hamming It Up” with Atsign’s Colin Constable, Creator of CATWEB Mobile App For and By the Ham Radio Community. Colin Constable, AI6BH When the South Londoner, Colin Constable, traipsed down the ro...',
    link: 'https://atsigncompany.medium.com/hamming-it-up-with-the-companys-colin-constable-creator-of-catweb-mobile-app-for-and-by-the-eb5b4e308dde?source=rss-f779d31710de------2'
  },
  {
    title: 'Developers, it’s time to #flipoffsocialmedia',
    pubDate: '2021-12-05 00:10:11',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*TSLgiZSrKxKWg9V3',
    description: 'How’s that for a title? I had to use that title so that it would show up in your social media feeds, and that is exactly the point of this post. If I had used my original title, “Calling all develo...',
    link: 'https://atsigncompany.medium.com/developers-its-time-to-flipoffsocialmedia-28de97c1f4f4?source=rss-f779d31710de------2'
  },
  {
    title: 'Building Flutter apps with no backend?',
    pubDate: '2021-10-19 13:28:55',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*9DJJ43R8XuSJmkAa',
    description: 'It’s possible with the free &amp; open-source atPlatform. As developers, we have to make so many decisions when we start a 
new project: What database should I use?What is the best architecture to h...',
    link: 'https://medium.com/flutter-community/building-flutter-apps-with-no-backend-9715b764a81e?source=rss-f779d31710de------2'
  },
  {
    title: 'Atsign Core Values',
    pubDate: '2021-07-20 18:40:07',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/1*mgxByEl57BjDDqZBW4SkEw.png',
    description: 'At Atsign (formerly The @ Company), we are building a flat organization, where decisions that impact the success of the company will be made at every level. As a group, we put together a list of co...',
    link: 'https://atsigncompany.medium.com/the-company-core-values-61de7bf978f8?source=rss-f779d31710de------2'
  },
  {
    title: 'Ask the Founders: Storage &amp; Memory &amp; Servers, Oh My!',
    pubDate: '2021-05-29 00:03:38',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*9LT2hxetIEVsvQrQmijmSQ.jpeg',
    description: 'Frequently Asked Questions about our private, open-source protocol Photo by Fredy Jacob on UnsplashThe atPlatform is a clever abstraction machine. Perhaps the most abstracted component in the entir...',
    link: 'https://atsigncompany.medium.com/ask-the-founders-storage-memory-servers-oh-my-250e302352c0?source=rss-f779d31710de------2'       
  },
  {
    title: 'Ask the Founders: Breaking Down the atPlatform',
    pubDate: '2021-05-26 05:25:58',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*9WDXtWH1sA53JsH4oTg4dQ.jpeg',
    description: 'Frequently Asked Questions about our private, open-source protocol Photo by Matt Palmer on UnsplashWhen it comes to understanding the atPlatform and the atSign, our developers are very good at rais...',
    link: 'https://atsigncompany.medium.com/ask-the-founders-breaking-down-the-platform-1ab999d1b9ce?source=rss-f779d31710de------2'
  },
  {
    title: 'If you love your customers, set them free',
    pubDate: '2021-05-20 18:00:02',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1000/1*OietD5Qtl-OYR_CcQ_6llg.jpeg',
    description: 'A post-cookie-era CRM strategy and marketing mantra While watching a show on Animal Planet with my kids, I experienced something I haven’t in years of owning a DVR: commercials. We couldn’t fast-fo...',
    link: 'https://atsigncompany.medium.com/if-you-love-your-customers-set-them-free-d9237b7b698?source=rss-f779d31710de------2'
  },
  {
    title: 'Ask the Founders: What is the atPlatform?',
    pubDate: '2021-05-19 21:37:46',
    author: 'Atsign',
    thumbnailUrl: 'https://cdn-images-1.medium.com/max/1024/0*aP8VGvdhn58IETvw',
    description: 'Frequently Asked Questions about our private, open-source protocol Image from UnsplashPart of the great thing about working at Atsign is that we get to chat with the developers trying out the atPla...',
    link: 'https://atsigncompany.medium.com/ask-the-founders-what-is-the-platform-89cdd644bcde?source=rss-f779d31710de------2'
  },
  {
    title: 'Contributing to an Open-Source GitHub Project',
    pubDate: '2021-05-03T22:15:51.851Z',
    author: 'WildGreen',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1620079395708/dFw1lTLIS.png',
    description: 'Overview: There are a countless number of open source projects that exist on the Internet, but just how are you meant to add anything to these? What does forking a repository mean? What is a pull r...',
    link: 'https://hashnode.com/@wildgreen'
  },
  {
    title: 'What is an atsign and why you need one?',
    pubDate: '2022-05-20T11:57:30.943Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1653045960070/nE4qu0NBQ.png',
    description: 'Introduction Following the questions, I got asked in person and even online, I am taking this opportunity to talk about what an @‎sign is and why you should get one. First, it is pronounced as ‘at-...',
    link: 'https://hashnode.com/@CynthiaPeter'
  },
  {
    title: 'Deploying and Managing Your Machine Learning Pipeline with Terraform and Doppler',
    pubDate: '2021-11-24T12:00:29.577Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1637755006544/1_Mh5lD0w.jpeg',
    description: 'Outline Please complete in as much detail as possible.  Introduction to ML pipeline Brief intro to Terraform and doppler Setting up Doppler Installing Terraform and AWS to set up model infrastructu...',
    link: 'https://hashnode.com/@CynthiaPeter'
  },
  {
    title: 'Flutterflow celebrates one year Anniversary and over 60,000 Builders.🎉🎉🎉',
    pubDate: '2021-11-04T11:15:20.062Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1636018340570/6jmyeUpJR.jpeg',
    description: "Flutterflow celebrates its First Anniversary and closes in on 60,000+ builders. This may be the first time you're reading about Flutterflow or maybe the first time you're seeing it on your screen. ...",
    link: 'https://hashnode.com/@CynthiaPeter'
  },
  {
    title: 'Most Common Questions About Technical Writing Answered',
    pubDate: '2021-09-30T15:10:20.751Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1633014066780/8pd2j1BFX.jpeg',
    description: 'In a previous article, you learned what technical writing is. Who is a technical writer? How to get started with technical 
writing and some basics. After the previous article, I received a couple o...',
    link: 'https://hashnode.com/@CynthiaPeter'
  },
  {
    title: "A beginners' guide to get started with Technical Writing",
    pubDate: '2021-09-22T21:26:39.077Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1632345513014/e-7JMBKJC.jpeg',
    description: "In the past few months, I have spoken at events where I was asked 'how do I get started with technical writing?' Most recently, I received over 5 direct messages(DM's) on Twitter asking me how they...",
    link: 'https://hashnode.com/@CynthiaPeter'
  },
  {
    title: 'Advantages of Using Flutter as A Cross-Platform Development tool.',
    pubDate: '2021-09-22T21:11:18.716Z',
    author: 'CynthiaPeter',
    thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1632344771812/uD70tC6ID.jpeg',
    description: 'In the past 2 years, the software development community has recorded a great increase in the use of Google Flutter SDK. And as a result of this, we have more people asking questions and wondering w...',
    link: 'https://hashnode.com/@CynthiaPeter'
  }
]

XavierChanth · 2022-07-05T21:11:46Z

@JeremyTubongbanua I don't like the idea of using a list of usernames, in case someone decides to publish something more personal to their account.

Hashnode also has an rss feed, for which we could do something similar to medium.

JeremyTubongbanua · 2022-07-09T20:35:37Z

Example of one of the hashnode articles (via https://blog.atsign.dev/rss.xml)

{
  title: 'The at_contacts_flutter library on the @platform',
  author: 'Damien Bahati',
  thumbnailUrl: 'https://cdn.hashnode.com/res/hashnode/image/upload/v1628090494502/gsBuTxAFW.png',
  pubDate: '2021-08-09 18:13:55',
  description: 'Too many atSigns to keep track of? Thats no problem with the at_contacts_flutter package! Simply add the at_contacts_flutter dependency to your project, and youll be capable 
of performing several a...',
  link: 'https://blog.atsign.dev/the-atcontactsflutter-library-on-the-platform-cks4yei3001mjfcs16lwphn1x'
}

JeremyTubongbanua · 2022-08-18T22:55:51Z

Am not working on this, but it just occurred to me that Hugo is a static site generator

So is dynamic content even possible @XavierChanth ?

XavierChanth · 2022-08-19T03:34:04Z

legacy due to #94 , closing this PR.
@JeremyTubongbanua could you push this to atsign-foundation:card/blogpost so that we retain a copy of the code in case we decide to continue work on this in the future.

Add card/blogpost template (shortcode and shortcode tutorial)

b1a1122

JeremyTubongbanua self-assigned this Jun 20, 2022

JeremyTubongbanua mentioned this pull request Jun 20, 2022

devsite 3 | blog posts page #44

Closed

3 tasks

JeremyTubongbanua added the enhancement New feature or request label Jun 22, 2022

JeremyTubongbanua and others added 2 commits June 26, 2022 13:28

Merge branch 'atsign-foundation:trunk' into card/blogpost

7f70893

card/blogpost shortcode

727bc24

JeremyTubongbanua requested a review from XavierChanth June 26, 2022 17:33

JeremyTubongbanua added 2 commits June 29, 2022 13:40

npm install node-fetch

d5fc729

Add getItems() function to js assets (articleFetch.js) - only sup…

8478f45

…ports Medium articles for now

JeremyTubongbanua added 2 commits June 29, 2022 15:37

Add row.html shortcode (bootstrap)

053f543

Add row shortcode to card/blogpost contribute documentation

fe5362b

JeremyTubongbanua and others added 9 commits July 1, 2022 09:30

isometric-fetch as dev dependency

73c5f27

Merge branch 'atsign-foundation:trunk' into card/blogpost

e7a7427

isometric-fetch as devDependency in package.json

154317d

rename articleFetch.js to blog.js

4dbbf6e

Add link to JS object in blog.js

597dc4c

Add publishDate to card/blogpost attributes

f91fad7

Update card/blogpost example

30737d4

Remove author attribute duplicate

7e5c922

Add publishDate to shortcode blogpost.html

b996d73

Completed dynamic blog fetching for Medium and Hashnode (with limitat…

8d603b5

…ions)

Add getHashNodeItems to module.exports for blog.js`

2137481

JeremyTubongbanua changed the title ~~Add card/blogpost template (shortcode and shortcode tutorial)~~ feat: card/blogpost.html shortcode and assets/js/blog.js dynamic article fetching Jul 6, 2022

feat: implement hashnode rss feed

1ffabbe

XavierChanth closed this Aug 19, 2022

JeremyTubongbanua mentioned this pull request Aug 19, 2022

feat: dynamic blog fetching (merge to upstream/blogpost) #99

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: `card/blogpost.html` shortcode and `assets/js/blog.js` dynamic article fetching #72

feat: `card/blogpost.html` shortcode and `assets/js/blog.js` dynamic article fetching #72

JeremyTubongbanua commented Jun 20, 2022 •

edited

Loading

JeremyTubongbanua commented Jun 21, 2022

JeremyTubongbanua commented Jun 26, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022 •

edited

Loading

XavierChanth commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022 •

edited

Loading

XavierChanth commented Jul 5, 2022

JeremyTubongbanua commented Jul 9, 2022

JeremyTubongbanua commented Aug 18, 2022

XavierChanth commented Aug 19, 2022

feat: card/blogpost.html shortcode and assets/js/blog.js dynamic article fetching #72

feat: card/blogpost.html shortcode and assets/js/blog.js dynamic article fetching #72

Conversation

JeremyTubongbanua commented Jun 20, 2022 • edited Loading

What this PR is for:

JeremyTubongbanua commented Jun 21, 2022

JeremyTubongbanua commented Jun 26, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jun 29, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022 • edited Loading

XavierChanth commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022

JeremyTubongbanua commented Jul 1, 2022 • edited Loading

Very important commit: 8d603b5

2 functions:

Limitations:

XavierChanth commented Jul 5, 2022

JeremyTubongbanua commented Jul 9, 2022

JeremyTubongbanua commented Aug 18, 2022

XavierChanth commented Aug 19, 2022

feat: `card/blogpost.html` shortcode and `assets/js/blog.js` dynamic article fetching #72

feat: `card/blogpost.html` shortcode and `assets/js/blog.js` dynamic article fetching #72

JeremyTubongbanua commented Jun 20, 2022 •

edited

Loading

JeremyTubongbanua commented Jul 1, 2022 •

edited

Loading

JeremyTubongbanua commented Jul 1, 2022 •

edited

Loading

Very important commit: `8d603b5`