diff --git a/data/projects.json b/data/projects.json new file mode 100644 index 00000000..8df2d085 --- /dev/null +++ b/data/projects.json @@ -0,0 +1,20 @@ +[ + { + "title": "Front-End Checklist V1", + "url": "https://frontendchecklist.io/", + "status": "active", + "description_en": "The Front-End Checklist is an exhaustive list of all elements you need to have / to test before launching your website / HTML page to production.", + "description_fr": "", + "category_en": "", + "category_fr": "" + }, + { + "title": "UI Patterns for developers", + "url": "https://ui-patterns-dev.vercel.app/fr", + "status": "work in progress", + "description_en": "A full guide on all UI Patterns, practices, pitfalls and gotchas for front-end developers.", + "description_fr": "", + "category_en": "", + "category_fr": "" + } +] diff --git a/locales/en/common.json b/locales/en/common.json index 63e4f0d5..a362f854 100644 --- a/locales/en/common.json +++ b/locales/en/common.json @@ -125,7 +125,22 @@ "popular": "Popular Github Projects", "popular_description": "My most popular open-source projects. Feel free to take a look and contribute!", "viewAll": "→ View all my projects", - "latest-projects": "Latest updated projects" + "latest-projects": "Current projects" + } + }, + "openProjects": { + "path": "/projects", + "seo": { + "url": "projects", + "title": "My Projects", + "description": "Discover all the projects I've worked on or I'm currently working on." + }, + "updated": "Updated {{date}} ago", + "sections": { + "popular": "Popular Github Projects", + "popular_description": "My most popular open-source projects. Feel free to take a look and contribute!", + "viewAll": "→ View all my projects", + "latest-projects": "Updated Open-Source projects" } }, "tags": { diff --git a/locales/fr/common.json b/locales/fr/common.json index 84c3b5a7..a9e250ee 100644 --- a/locales/fr/common.json +++ b/locales/fr/common.json @@ -120,6 +120,21 @@ "latest-projects": "Derniers projets MàJ" } }, + "openProjects": { + "path": "/projects", + "seo": { + "url": "projects", + "title": "Mes Projets", + "description": "Découvrez l'ensemble des projets sur lesquels j'ai travaillé et ceux sur lequel je suis toujours en train de travailler." + }, + "updated": "MàJ il y a {{date}}", + "sections": { + "popular": "Projets populaires sur Github", + "popular_description": "Mes projets Open Source les plus populaires. N'hésitez pas à y jeter un coup d'œil et à y participer!", + "viewAll": "→ Voir tous mes projets", + "latest-projects": "Derniers projets MàJ" + } + }, "tags": { "path": "/tags", "seo": { diff --git a/public/rss/feed.xml b/public/rss/feed.xml index 54d39bfd..f9f34eae 100644 --- a/public/rss/feed.xml +++ b/public/rss/feed.xml @@ -4,7 +4,7 @@ The David Dias | Front-End Developer, podcaster & content creator https://thedaviddias.dev Hey, I'm David Dias! Front-End Developer based in Toronto/Canada. I love talking about code, technology, expatriation and life. - Mon, 17 Jul 2023 01:48:12 GMT + Mon, 17 Jul 2023 03:35:00 GMT https://validator.w3.org/feed/docs/rss2.html https://github.com/jpmonette/feed en-US diff --git a/public/rss/fr/feed.xml b/public/rss/fr/feed.xml index adba04fe..b087fad1 100644 --- a/public/rss/fr/feed.xml +++ b/public/rss/fr/feed.xml @@ -4,7 +4,7 @@ The David Dias | Développeur Front-End, podcasteur & créateur de contenu https://thedaviddias.dev Salut toi! Je m'appele David Dias. Je suis développeur Front-End, podcasteur, créateur de contenu numérique passioné pour résoudre les problèmes digitaux et humains! J'aime rencontrer de nouvelles personnes, bâtir des communautées et parler de tech, d'expatriation et de web. - Mon, 17 Jul 2023 01:48:12 GMT + Mon, 17 Jul 2023 03:35:00 GMT https://validator.w3.org/feed/docs/rss2.html https://github.com/jpmonette/feed fr diff --git a/src/components/LatestGithubSection/LatestGithubSection.tsx b/src/components/LatestGithubSection/LatestGithubSection.tsx index af23471b..fdbbf41f 100644 --- a/src/components/LatestGithubSection/LatestGithubSection.tsx +++ b/src/components/LatestGithubSection/LatestGithubSection.tsx @@ -16,7 +16,7 @@ export const LatestGithubSection: React.FC = ({ projec return (
-
{t('projects.sections.latest-projects')}
+
{t('openProjects.sections.latest-projects')}
{projects?.map((project, i) => ( @@ -25,7 +25,7 @@ export const LatestGithubSection: React.FC = ({ projec
{projects.length ? (
- {t('projects.sections.viewAll')} + {t('openProjects.sections.viewAll')}
) : null}
diff --git a/src/components/LatestProjectsSection/LatestProjectsSection.tsx b/src/components/LatestProjectsSection/LatestProjectsSection.tsx new file mode 100644 index 00000000..93d8c1f8 --- /dev/null +++ b/src/components/LatestProjectsSection/LatestProjectsSection.tsx @@ -0,0 +1,33 @@ +import useTranslation from 'next-translate/useTranslation' + +import { CustomLink } from '../CustomLink' +import { H5 } from '../Headings' +import { Projects } from '../Projects' + +export type LatestProjectsSectionProps = { + projects: any[] +} + +export const LatestProjectsSection: React.FC = ({ projects }) => { + const { t } = useTranslation('common') + + return ( +
+
+
{t('projects.sections.latest-projects')}
+
+ +
+ {projects?.map((project, i) => ( + + ))} +
+ + {projects.length ? ( +
+ {t('projects.sections.viewAll')} +
+ ) : null} +
+ ) +} diff --git a/src/components/LatestProjectsSection/index.ts b/src/components/LatestProjectsSection/index.ts new file mode 100644 index 00000000..231bc360 --- /dev/null +++ b/src/components/LatestProjectsSection/index.ts @@ -0,0 +1 @@ +export * from './LatestProjectsSection' diff --git a/src/components/ProjectCard/ProjectCard.tsx b/src/components/ProjectCard/ProjectCard.tsx new file mode 100644 index 00000000..81b3fc7b --- /dev/null +++ b/src/components/ProjectCard/ProjectCard.tsx @@ -0,0 +1,52 @@ +import Image from 'next/image' +import useTranslation from 'next-translate/useTranslation' + +import { CustomLink } from '@/components/CustomLink' +import { H5 } from '@/components/Headings' +import { Paragraph } from '@/components/Paragraph' + +import { UsesType } from '@/types' + +type ProjectCardProps = { + tool: UsesType +} + +export const ProjectCard: React.FC = ({ tool }) => { + const { lang } = useTranslation('common') + + return ( +
+ {tool.image ? ( +
+ {`Thumbnail +
+ ) : null} +
+
+ + {tool.title} + +
+ + + {tool.status} + + {tool[`description_${lang}` as keyof UsesType]} +
+
+ ) +} diff --git a/src/components/ProjectCard/index.ts b/src/components/ProjectCard/index.ts new file mode 100644 index 00000000..4ba0fdbb --- /dev/null +++ b/src/components/ProjectCard/index.ts @@ -0,0 +1 @@ +export * from './ProjectCard' diff --git a/src/components/Projects/Projects.tsx b/src/components/Projects/Projects.tsx new file mode 100644 index 00000000..9b188c4b --- /dev/null +++ b/src/components/Projects/Projects.tsx @@ -0,0 +1,9 @@ +import { ProjectCard } from '../ProjectCard' + +export type ProjectsProps = { + project: any +} + +export const Projects: React.FC = ({ project }) => { + return +} diff --git a/src/components/Projects/index.ts b/src/components/Projects/index.ts new file mode 100644 index 00000000..33b908c6 --- /dev/null +++ b/src/components/Projects/index.ts @@ -0,0 +1 @@ +export * from './Projects' diff --git a/src/components/ToolCard/ToolCard.tsx b/src/components/ToolCard/ToolCard.tsx index 52e0cae5..5ad5e351 100644 --- a/src/components/ToolCard/ToolCard.tsx +++ b/src/components/ToolCard/ToolCard.tsx @@ -16,18 +16,20 @@ export const ToolCard: React.FC = ({ tool }) => { return (
-
- {`Thumbnail -
+ {tool.image ? ( +
+ {`Thumbnail +
+ ) : null}
({ path: '', seo: extendSEO({ options: { - title: translate('404:404.seo.title'), - description: translate('404:404.seo.description'), + title: translate('404.seo.title'), + description: translate('404.seo.description'), }, translate, }), diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 9b1a5676..dee04823 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -15,6 +15,7 @@ import { CurrentlyReading } from '@/components/CurrentlyReading' import { CustomLink } from '@/components/CustomLink' import { LatestNotesSection } from '@/components/LatestNotesSection' import { LatestPostsSection } from '@/components/LatestPostsSection' +import { LatestProjectsSection } from '@/components/LatestProjectsSection/LatestProjectsSection' import { Loader } from '@/components/Loader' import { ToRead } from '@/components/ToRead' @@ -50,12 +51,13 @@ type HomeProps = { articles: ArticlesType[] notes: NotesType[] ghProjects: GhProjectsProps[] + projects: any[] fallback: { '/api/youtube/videos': YouTubeVideo[] } } -const Home: NextPage = ({ articles, notes, ghProjects, fallback }) => { +const Home: NextPage = ({ articles, notes, ghProjects, fallback, projects }) => { const { t } = useTranslation('common') return ( @@ -144,6 +146,8 @@ const Home: NextPage = ({ articles, notes, ghProjects, fallback }) => + + {process.env.NODE_ENV === 'production' && !mobile() && } @@ -158,6 +162,7 @@ const Home: NextPage = ({ articles, notes, ghProjects, fallback }) => export const getStaticProps: GetStaticProps = async ({ locale }) => { const posts = await getAllPostsWithFrontMatter({ dataType: 'articles', locale, limit: 4 }) const notes = await getAllPostsWithFrontMatter({ dataType: 'notes', locale, limit: 4 }) + const projects = await readData('data/projects.json') const youtubeVideos = await readData('data/youtube.json') const ghProjects = await fetchRepos('PUSHED_AT', 2) @@ -166,6 +171,7 @@ export const getStaticProps: GetStaticProps = async ({ locale }) => { const props: HomeProps = { articles: JSON.parse(JSON.stringify(posts)), notes: JSON.parse(JSON.stringify(notes)), + projects: JSON.parse(JSON.stringify(projects)), ghProjects, fallback: { '/api/youtube/videos': youtubeVideos,