diff --git a/samples.json b/samples.json
new file mode 100644
index 000000000..f666a77c0
--- /dev/null
+++ b/samples.json
@@ -0,0 +1 @@
+{"0":{"name":"pnp-sp-dev-spfx-web-parts-vuejs-todo-single-file-component","title":"Todo Client Web Part built with Vue.js and Vue's single-file components","source":"pnp","shortDescription":"Sample Todo web part demonstrating how you can utilize Vue (a progressive framework for building user interfaces) with SharePoint Framework using handy single-file components approach.","url":"https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/vuejs-todo-single-file-component","longDescription":["Sample Todo web part demonstrating how you can utilize Vue (a progressive framework for building user interfaces) with SharePoint Framework using handy single-file components approach.","The Questionnaire meeting app displays the questions from attendees as pre-meeting app experience.","The sample also shows how to use SPFx Web Part asynchronous rendering using isRenderAsync property and renderCompleted method.","* Crop","* Flip","* Rotate","* Scale","* Filter (Grayscale / Sepia)","* Redo / Undo","* Histoy of Actions"],"creationDateTime":"2020-04-27","updateDateTime":"2022-04-04","products":["SharePoint","Teams","Subscriptions","Update Subscriptions","Get Subscriptions"],"metadata":[{"key":"CLIENT-SIDE-DEV","value":"VueJS"},{"key":"SPFX-VERSION","value":"1.10.0"},{"key":"SPFX-SUPPORTSTHEMEVARIANTS","value":"true"},{"key":"SPFX-TEAMSPERSONALAPP","value":"true"},{"key":"SPFX-TEAMSPERSONALAPP","value":"true"},{"key":"PNPCONTROLS","value":"WebPartTitle"},{"key":"REACT-HOOKS","value":"true"}],"thumbnails":[{"type":"image","order":100,"url":"https://github.com/pnp/media/raw/master/parker/pnp/300w/parker.png","alt":"Todo Client Web Part built with Vue.js and Vue's single-file components","name":"salesOrders.gif","slides":null},{"type":"image","order":101,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/section-backgrounds/assets/webpartexample1.png?raw=true","alt":"Supporting section backgrounds in your web parts","name":"salesOrders01.png"},{"type":"image","order":102,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/section-backgrounds/assets/webpartexample2.png?raw=true","alt":"Supporting section backgrounds in your web parts","name":"salesOrders02.png"},{"type":"image","order":100,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-zod/assets/failed-parse.png","alt":"Web Part Preview","name":"teams01.png"},{"type":"image","order":100,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-zod/assets/schema.png","alt":"Web Part Preview","name":"Govenor_Sharing_AddtoTeam.png"},{"type":"image","order":105,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-timeline/assets/list-schema.png?raw=true","alt":"Timeline","name":"Govenor_Sharing_AddtoTeamTab.png"},{"type":"image","order":106,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-timeline/assets/wepart-propertypane.png?raw=true","alt":"Timeline","name":"Govenor_Sharing_AddtoTeam_Save.png"},{"type":"image","order":107,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-real-time/assets/spfx-newitem.png?raw=true","alt":"Real Time News Feed using Azure Logic Apps, Node.js and socket.io","name":"Govenor_Sharing_AddtoTeam_Search.png"},{"type":"image","order":108,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/Screen14.png?raw=true","alt":"My Tasks Web Part","name":"Govenor_Sharing_AddtoTeam_SelectTeam.png"},{"type":"image","order":109,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen2.png?raw=true","alt":"My Tasks Web Part","name":"screenshot.png"},{"type":"image","order":110,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen3.png?raw=true","alt":"My Tasks Web Part","name":"screenshot2.png"},{"type":"image","order":111,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen4.png?raw=true","alt":"My Tasks Web Part","name":"SharePoint_Admin_Center_API_Consent.png"},{"type":"image","order":112,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen5.png?raw=true","alt":"My Tasks Web Part","name":"SharePoint_Admin_Center_API_Consent_Approve.png"},{"type":"image","order":113,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen6.png?raw=true","alt":"My Tasks Web Part","name":"SharePoint_Admin_Center_Enable_app.png"},{"type":"image","order":114,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen7.png?raw=true","alt":"My Tasks Web Part","name":"SharePoint_Admin_Center_Manage_apps.png"},{"type":"image","order":115,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen8.png?raw=true","alt":"My Tasks Web Part","name":"SharePoint_Admin_Center__Remove_API_Consent.png"},{"type":"image","order":116,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-mytasks/assets/screen9.png?raw=true","alt":"My Tasks Web Part","name":"Teams_Admin_Center_Manage_apps.png"},{"type":"image","order":117,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-manage-sitedesigns/assets/screen9.jpg?raw=true","alt":"Site Designs Manager","name":"Teams_Admin_Center_Manage_apps_Upload.png"},{"type":"image","order":118,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-office365cli-script.PNG?raw=true","alt":"React Jest Testing sample","name":"Teams_Admin_Center_Manage_apps_Uploaded.png"},{"type":"image","order":119,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-overview.PNG?raw=true","alt":"React Jest Testing sample","name":"Troubleshooting_Teams_App_Already_Exists.png"},{"type":"image","order":120,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-repo-config.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":121,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-repos.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":122,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-select-repo.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":123,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-select-template.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":124,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-spfx.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":125,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-success.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":126,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-suggest.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":127,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-ubuntu.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":128,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github-vars.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":129,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/config-Azure-Pipelines-in-Github.PNG?raw=true","alt":"React Jest Testing sample"},{"type":"image","order":130,"url":"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-jest-testing/assets/SPFx-jest-coverage.png?raw=true","alt":"React Jest Testing sample"}],"authors":[{"gitHubAccount":"s-KaiNet","company":"Mastaq","pictureUrl":"https://github.com/s-KaiNet.png","name":"Sergei Sergeev","twitter":"sergeev_srg"},{"gitHubAccount":"gautamdsheth","company":"Rapid Circle","pictureUrl":"https://github.com/gautamdsheth.png","name":"Gautam Sheth","twitter":"gautamdsheth"},{"gitHubAccount":"AriGunawan","name":"Ari Gunawan","pictureUrl":"https://github.com/AriGunawan.png","company":"SoHo Dragon","twitter":"SmitaNachan"},{"gitHubAccount":"milanholemans","company":"","pictureUrl":"https://github.com/milanholemans.png","name":"Milan Holemans","twitter":"alexaterentiev"},{"gitHubAccount":"fthorild","company":"Sogeti Sweden","pictureUrl":"https://github.com/fthorild.png","name":"Fredrik Thorild","twitter":"delucagiulian"},{"gitHubAccount":"AriGunawan","company":"","pictureUrl":"https://github.com/AriGunawan.png","name":"Ari Gunawan","twitter":"Mohammad3mer"},{"gitHubAccount":"Eli-Schei","name":"Eli H. Schei","pictureUrl":"https://github.com/Eli-Schei"}],"references":[{"name":"Build your first SharePoint client-side web part","description":"Client-side web parts are client-side components that run in the context of a SharePoint page. Client-side web parts can be deployed to SharePoint environments that support the SharePoint Framework. You can also use modern JavaScript web frameworks, tools, and libraries to build them.","url":"https://learn.microsoft.com/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part"},{"name":"Supporting section backgrounds","description":"Starting with SharePoint Framework v1.8, web parts can be made aware of any section backgrounds and use these colors to improve the appearance of a web part when hosted in a section with a different background.","url":"https://learn.microsoft.com/sharepoint/dev/spfx/web-parts/guidance/supporting-section-backgrounds"},{"name":"Use Microsoft Graph in your solution","description":"Learn how you can leverage the Microsoft Graph API from your custom developed SPFx web parts.","url":"https://learn.microsoft.com/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis"},{"name":"Publish SharePoint Framework applications to the Marketplace","description":"Publishing your SharePoint Framework solutions to marketplace (also known as AppSource) and to SharePoint store, which allows you to reach other organizations and let them easily install your application in their Microsoft 365 tenant.","url":"https://learn.microsoft.com/sharepoint/dev/spfx/publish-to-marketplace-overview"}],"downloadUrl":"https://pnp.github.io/download-partial/?url=https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-zod","categories":[""]},"1":{"name":"pnp-sp-dev-spfx-web-parts-react-modern-birthdays","source":"pnp","title":"Birthdays","shortDescription":"Shows upcoming birthdays in the company","url":"https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-modern-birthdays","downloadUrl":"https://pnp.github.io/download-partial/?url=https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-modern-birthdays","longDescription":["The Web Part shows the upcoming birthdays in the company, the web parts reads birthdays from a list located on the tenant's root site with title \"Birthdays.\""],"creationDateTime":"2023-01-31","updateDateTime":"2023-01-31","products":["SharePoint"],"metadata":[{"key":"CLIENT-SIDE-DEV","value":"React"},{"key":"SPFX-VERSION","value":"1.16.1"}],"thumbnails":[{"type":"image","order":100,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-modern-birthdays/assets/birthdays_teams.jpg","alt":"Web Part Preview"}],"authors":[{"gitHubAccount":"joaojmendes","pictureUrl":"https://github.com/joaojmendes.png","name":"João Mendes"}],"references":[{"name":"Build your first SharePoint client-side web part","description":"Client-side web parts are client-side components that run in the context of a SharePoint page. Client-side web parts can be deployed to SharePoint environments that support the SharePoint Framework. You can also use modern JavaScript web frameworks, tools, and libraries to build them.","url":"https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part"}]},"name":"pnp-sp-dev-spfx-web-parts-react-teams-my-webinars","source":"pnp","title":"Teams My Webinars","shortDescription":"Displays a list of Teams Webinars you are an organizer of, allows you to sync those webinars to a SharePoint list, to share within a Team and cross check pending registrants against membership of a team.","url":"https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-teams-my-webinars","downloadUrl":"https://pnp.github.io/download-partial/?url=https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-teams-my-webinars","longDescription":["Displays a list of Teams Webinars you are an organizer of, allows you to sync those webinars to a SharePoint list, to share within a Team and cross check pending registrants against membership of a team.","This web part has the fundamental functionality - a great starting point to build upon if you need something more advanced."],"creationDateTime":"2023-12-25","updateDateTime":"2023-12-31","products":["SharePoint"],"metadata":[{"key":"CLIENT-SIDE-DEV","value":"React"},{"key":"SPFX-VERSION","value":"1.18.2"}],"thumbnails":[{"name":"Screenshot 2023-12-25-main.png","type":"image","order":100,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-teams-my-webinars/assets/Screenshot 2023-12-25-main.png","alt":"Web Part Preview"},{"name":"Screenshot 2023-12-25-addtolist.png","type":"image","order":101,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-teams-my-webinars/assets/Screenshot 2023-12-25-addtolist.png","alt":"Web Part Preview"},{"name":"Screenshot 2023-12-25.png","type":"image","order":102,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-teams-my-webinars/assets/Screenshot 2023-12-25.png","alt":"Web Part Preview"},{"name":"poll-questions.png","type":"image","order":103,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-poll/assets/poll-questions.png","alt":"Web Part Preview"},{"name":"wp1.png","type":"image","order":104,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-poll/assets/wp1.png","alt":"Web Part Preview"},{"name":"wp2.png","type":"image","order":105,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-poll/assets/wp2.png","alt":"Web Part Preview"},{"name":"savetools.png","type":"image","order":106,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-personal-tools-list/assets/savetools.png","alt":"Web Part Preview"},{"name":"selecttools.png","type":"image","order":107,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-personal-tools-list/assets/selecttools.png","alt":"Web Part Preview"},{"name":"settings.png","type":"image","order":108,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-personal-tools-list/assets/settings.png","alt":"Web Part Preview"},{"name":"video-demo1.mp4","type":"video","order":109,"url":"https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-personal-tools-list/assets/video-demo1.mp4"}],"authors":[{"gitHubAccount":"techienickb","pictureUrl":"https://github.com/techienickb.png","name":"Nick Brown"}],"references":[{"name":"Build your first SharePoint client-side web part","description":"Client-side web parts are client-side components that run in the context of a SharePoint page. Client-side web parts can be deployed to SharePoint environments that support the SharePoint Framework. You can also use modern JavaScript web frameworks, tools, and libraries to build them.","url":"https://learn.microsoft.com/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part"}]}
\ No newline at end of file