Skip to content

Commit 0d1f3d7

Browse files
anuveyatsuanuveyatsu
authored
Merge pull request #1374 from datopian/fix/os-page-improvements
Blog post and OS page improvements
2 parents a2070c6 + bd67f5e commit 0d1f3d7

File tree

5 files changed

+61
-36
lines changed

5 files changed

+61
-36
lines changed

‎site/components/Features.tsx

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
import Container from "./Container";
2-
import { H1 } from "./custom/header";
3-
41
const features: { title: string; description: string; icon: string }[] = [
52
{
63
title: "Unified sites",
@@ -41,11 +38,16 @@ const features: { title: string; description: string; icon: string }[] = [
4138
export default function Features() {
4239
return (
4340
<div className="!m-0 !p-0">
44-
<H1 className=" text-primary dark:text-primary-dark ml-0">
45-
{" "}
46-
How PortalJS works?
47-
</H1>
48-
<p className="text-base mt-2 text-primary dark:text-primary-dark">
41+
<p className="text-base mt-2 text-primary dark:text-primary-dark">
42+
PortalJS is a composition-focused framework that provides reusable code
43+
snippets and examples for developers to integrate into their projects.
44+
Instead of offering a traditional component library that developers install
45+
and use directly, it emphasizes the flexibility and uniqueness of data portals
46+
by providing customizable, copy-pastable snippets that developers can tailor
47+
to their specific needs. PortalJS still provides a minimal core library
48+
with just the essentials designed for data portals.
49+
</p>
50+
<p className="text-base mt-2 text-primary dark:text-primary-dark">
4951
PortalJS is built in JavaScript and React on top of the popular Next.js
5052
framework, assuming a "decoupled" approach where the frontend is a
5153
separate service from the backend and interacts with backend(s) via an

‎site/content/blog/why-NASA-and-anyone-using-CKAN-should-consider-a-decoupled-front-end-with-PortalJS.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ created: 2025-05-19
44
description: "NASA’s open data portal is powered by CKAN—but what if its user experience could match its scientific depth? This post explores how a decoupled frontend using PortalJS can transform performance, design flexibility, and scalability—without changing the backend. Learn how CKAN and PortalJS can work together to deliver a faster, smarter, and more user-friendly data experience."
55
authors: ['anuveyatsu', 'popovayoana']
66
filetype: 'blog'
7+
image: /static/img/blog/2025-05-19-why-anyone-should-consider-decoupled-frontend/image2.webp
78
---
89

910
## **Imagine a Faster, Smarter NASA Data Portal**

‎site/layouts/blog/blogLayout.tsx

Lines changed: 48 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,59 @@
11
import { formatDate } from '@/lib/common'
22
import { Avatar } from '@/components/Avatar'
33
import { NextSeo } from 'next-seo'
4+
import siteConfig from '../../config/siteConfig'
45

56
type Props = any
67

78
export const BlogLayout: React.FC<Props> = ({ children, ...frontMatter }) => {
8-
const { title, date, authors, description } = frontMatter
9+
const { title, date, authors, description, image } = frontMatter
910

1011
return (
11-
<article className="docs prose prose-a:text-primary dark:prose-a:text-primary-dark prose-strong:text-primary dark:prose-strong:text-primary-dark prose-code:text-primary dark:prose-code:text-primary-dark prose-headings:text-primary dark:prose-headings:text-primary-dark prose text-primary dark:text-primary-dark prose-headings:font-headings dark:prose-invert prose-a:break-words mx-auto p-6">
12-
<header>
13-
<div className="mb-4 flex-col items-center">
14-
{title && <h1 className="flex justify-center mb-0">{title}</h1>}
15-
{date && (
16-
<p className="mt-2 text-sm text-zinc-400 dark:text-zinc-500 flex justify-left">
17-
<time dateTime={date}>{formatDate(date)}</time>
18-
</p>
19-
)}
20-
{authors && (
21-
<div className="flex flex-wrap not-prose items-center justify-left gap-4">
22-
{authors.map(({ name, avatar, urlPath }) => (
23-
<Avatar
24-
key={urlPath || name}
25-
name={name}
26-
img={avatar}
27-
href={urlPath ? `/${urlPath}` : undefined}
28-
/>
29-
))}
30-
</div>
31-
)}
32-
</div>
33-
</header>
34-
<section>{children}</section>
35-
</article>
12+
<>
13+
<NextSeo
14+
title={title}
15+
description={description}
16+
openGraph={{
17+
title,
18+
description,
19+
images: [
20+
{
21+
url: image ? `https://www.portaljs.com` + image : siteConfig.nextSeo.openGraph.images[0].url,
22+
alt: title,
23+
},
24+
],
25+
type: 'article',
26+
}}
27+
twitter={{
28+
cardType: 'summary_large_image',
29+
site: '@PortalJS_',
30+
}}
31+
/>
32+
<article className="docs prose prose-a:text-primary dark:prose-a:text-primary-dark prose-strong:text-primary dark:prose-strong:text-primary-dark prose-code:text-primary dark:prose-code:text-primary-dark prose-headings:text-primary dark:prose-headings:text-primary-dark prose text-primary dark:text-primary-dark prose-headings:font-headings dark:prose-invert prose-a:break-words mx-auto p-6">
33+
<header>
34+
<div className="mb-4 flex-col items-center">
35+
{title && <h1 className="flex justify-center mb-0">{title}</h1>}
36+
{date && (
37+
<p className="mt-2 text-sm text-zinc-400 dark:text-zinc-500 flex justify-left">
38+
<time dateTime={date}>{formatDate(date)}</time>
39+
</p>
40+
)}
41+
{authors && (
42+
<div className="flex flex-wrap not-prose items-center justify-left gap-4">
43+
{authors.map(({ name, avatar, urlPath }) => (
44+
<Avatar
45+
key={urlPath || name}
46+
name={name}
47+
img={avatar}
48+
href={urlPath ? `/${urlPath}` : undefined}
49+
/>
50+
))}
51+
</div>
52+
)}
53+
</div>
54+
</header>
55+
<section>{children}</section>
56+
</article>
57+
</>
3658
)
3759
}

‎site/layouts/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { SimpleLayout, UnstyledLayout } from '@portaljs/core'
2-
import { BlogLayout } from '@portaljs/core'
2+
import { BlogLayout } from './blog'
33
import DefaultLayout from './default'
44
import { DocsLayout } from '@portaljs/core'
55
import CaseStudyLayout from './casestudy'

‎site/pages/[...slug].tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export default function Page({ source, meta, sidebarTree }) {
3838
})
3939

4040
// Generate the canonical URL (adjust this logic if necessary)
41-
const canonicalUrl = `https://www.portaljs.com${meta.urlPath}`
41+
const canonicalUrl = `https://www.portaljs.com/${meta.urlPath}`
4242
const title = meta.metatitle || meta.title
4343
const description = meta.metadescription || meta.description
4444
const image = meta.image ? `https://www.portaljs.com` + meta.image : siteConfig.nextSeo.openGraph.images[0].url

0 commit comments

Comments
 (0)