Finsweet的动态

Just open-sourced 3 months of work. ?? My personal internationalized portfolio in Next.js 14 with Notion as a CMS. Check out the github repo: https://lnkd.in/g_XAsqTF Check out the portfolio: https://arbizen.com Features: ? Next.js 14 ? Typescript ? Eye-catchy design converted pixel-perfect from Figma ? Completely dynamic with Notion ? Robust infra to integrate Notion with Next.js in no time ? Internationalization with three languages ? Dynamic OG image generation ? Pagination integrated with Notion ? Filter by category and tags ? SSR & Perfect SEO ? Optimized metadata & custom json-ld schema ? Optimized image ? Easy to setup for your own portfolio in no-time ? Super fast (thanks to next.js ssr) ? Best practices & readable code ? Code highlighting in blog

The release of Strapi v5 is closer than ever. At Localazy we're fans of this headless CMS and offer an integration to make your localization efforts seamless if you use the tool. ?? And while we wait for the next improvements, we've gone over the basics of the current design system, which: - Ensures consistency is maintained by developers and content managers, - and is easy to integrate with different code libraries, like React. Learn how in this tutorial by Mary Okosun: https://bit.ly/4aWzxvE

??"Thrilled to introduce my latest web project—an engaging cat fact?? showcase powered by API calls! Through HTML, CSS, and JavaScript, I've created a seamless user experience where cat enthusiasts can dive into a plethora of intriguing feline facts. With each click, users uncover a new nugget of information, fact, fostering curiosity and delight. This project not only demonstrates my proficiency in web development but also my dedication to creating immersive and enjoyable online experiences. Join me in celebrating the charm and wonder of our beloved feline companions! ??API link:- https://catfact.ninja/fact ?? For source code visit my GitHub page :-https://lnkd.in/gcAe7p8p #WebDevelopment #JavaScript #API #CatFacts #UserExperience"

?? WCAG 2.2 Cards—now in French and so much more! ?? What’s new in version 0.5? ? French translation is now available. ?? ? I finally started a GitHub repository to provide additional resources: - Language files in JSON format. - Card content/relations linking themes, disabilities, and role responsibilities to each success criterion. - Figma files (*.fig) for manual import (perfect for when the Figma Community file isn’t available after updates ??) More resources are coming soon on GitHub including color tokens, an accessible HTML version, ... Stay tuned! ??? Check out the GitHub repository: ?? https://lnkd.in/d98AdZvj ?? Thank you to all contributors who made this possible! A special thank you for this new version goes to: Will Noonan and his amazing students Alessandro Barone, Aymeric Tridon, Elisabeth Duranthon, Laura Tomasello, Sara Mirabella, Serena Furnari, and Yasmine Benotmane for translating the deck to French and helping improve the Italian version. Hanna K?hler for helping me with the German translation. And a huge thanks to Adil Hussain, Andreas Santarsieri, Andrii Kuplevakhskyi, Anna Gro?alber, Annelies Verhelst, Andrew Hick, Bruno Pulis, Carmen Ruiz Seco, Christiane Moser, Estella Oncins Noguer, Jorge Montero, Jordi Turull, Laia Sánchez, Laura Wissiak, Makoto Ueki, Manon van Keulen, Manuel Sánchez, mARTin Hinterdorfer, and Michele Cardinali for their incredible contributions across translations, design feedback, and features. ?? ?? Want to contribute? Missing a language? Interested in helping with translations or features? Drop a comment! ?? Explore all resources in the GitHub repo: ?? https://lnkd.in/d98AdZvj ?? Figma Community File Link: ?? https://lnkd.in/dubpNX9M #A11Y #DigitalAccessibility #Accessibility #Barrierefreiheit #CardDeck #WCAG #W3C #Toolkit

HTML entities can easily break during translation, leading to issues that disrupt your content and user experience. ???? To ensure your HTML tags stay intact and your content remains accurate across all language versions, use Lingohub's Quality Checks feature. It’s designed to keep your HTML in perfect shape - https://lnkd.in/e3Spsgx6

?? ?????????? ???? ?????????? ??????????: Quickly explore essential features, updates, and best practices in an interactive guide for developers! ??

?? Launching a new blog? Here's a game-changing template you need to see. Introducing the Simple Astro Blog template, powered by Cosmic headless CMS. It's the perfect solution for developers who value: ? Lightning-fast performance ? Clean, minimal setup ? Zero client-side JavaScript ? Tailwind CSS styling The best part? It's ready to use right out of the box. Just update your environment variables and start creating content. We'd love to hear from fellow developers: What features do you look for in a blog template? Explore the template here: https://lnkd.in/gxR_iDRc

I'm thrilled to share a major project that I've recently completed, leveraging the power of Tailwind CSS to create a sleek, responsive, and user-friendly web application. Here's a brief overview: After completing this task I was learn how to make a UI a responsive UI using Tailwind.? How creating UI using tailwind makes my work way too faster? I am using multiple Tailwind classes

The "Figma to shadcn/ui" plugin's new features will drop this week to shadcndesign.com: 1. Open the generated code in v0: Open the component's code in v0 for immediate testing and customization 2. Install the generated component with shadcn CLI: Get the shadcn/ui CLI command to add the component to your project immediately 3. Export the CSS variables from Figma to globals.css: The plugin generates properly formatted CSS that you can immediately paste into your project's globals.css file 4. Import the CSS variables from shadcn/ui to Figma: Maintain consistency in variables when updates happen on the development side Btw, I just finished working on a simple landing page and the docs.

Transform Your Design Workflow with Figma AI! Are you tired of the tedious process of converting Figma designs into code? Say goodbye to manual coding with the Builder.io AI-Powered Figma to Code plugin! What Can It Do? ?? Instant Code Generation: Convert your Figma designs into clean, responsive code for frameworks like React, Vue, Tailwind, and more in just a click. ?? No Setup Required: Jump straight from design to development without altering your Figma files. ?? Responsive by Default: Automatically adjusts your designs for all screen sizes, making your web and app projects truly mobile-friendly. ?? Choose Your Framework: Supports multiple frameworks including React, Next.js, Vue, Svelte, Angular, Qwik, Solid, React Native, or even plain HTML! Why You'll Love It: ?? Speed Up Development: Cut down on development time by automating the design-to-code handoff. ?? Consistency: Maintain design integrity from Figma to your live application with pixel-perfect accuracy. ?? Collaborative Efficiency: Enhance teamwork by bridging the gap between designers and developers with seamless integration. Ready to revolutionize your workflow? Check out the Builder.io plugin on Figma's community page and start building smarter, not harder! Check in Comments to Explore the Plugin! #Figma #DesignToCode #AI #WebDevelopment #Frontend #React #Vue #TailwindCSS #Productivity