Florian Rappl’s Post

Introducing BETH: The Modern Web Stack In the ever-evolving world of web development, numerous stacks have emerged, each built on one or two main frameworks. As of today, popular web stacks like MERN (MongoDB, Express, React, Node), MEVN, PERN, and more are widely recognized. However, the recent introduction of exciting new tools and frameworks has given birth to a fresh web stack, known as BETH. "The BETH Stack Frameworks" The BETH stack comprises four key frameworks: 1. Bun : Bun is an all-in-one JavaScript/TypeScript toolkit that impresses with its incredible speed. It includes a runtime supporting TypeScript and JSX, a fast package manager, a test runner, and a modern JavaScript bundler. Bun's focus is on performance and developer experience, and it's a seamless replacement for Node.js.     2. Elysia : Elysia is a Bun TypeScript server framework known for its exceptional performance and developer-friendly features. It boasts incredible speed, a straightforward development process, strict typing, OpenAPI compliance, and an active ecosystem of plugins.     3. Turso : Turso is an edge-hosted distributed database based on libSQL. Known for its simplicity and performance, it integrates with popular platforms like Vercel, Cloudflare, and Netlify.     4. HTMX : HTMX is a powerful library that offers access to AJAX, CSS Transitions, WebSockets, and Server Sent Events directly from HTML, eliminating the need for unnecessary JavaScript code.    Additional Libraries for the BETH Stack : Some additional libraries complement the BETH stack, including typed-html (type-safe HTML templating), Tailwind CSS (a utility-first CSS framework), Drizzle (a lightweight and SQL-focused ORM), Hyperscript (for enhancing HTML with concise DOM, event, and sync features), and Fly.io (for simple deployment). How to Use the BETH Stack : The BETH stack revolves around using JSX with HTMX and Hyperscript for interactivity in a Bun & Elysia server, allowing you to build a lightweight and fast website. For more information, visit the [BETH Stack GitHub repository](https://lnkd.in/eMX9dH3w). This is my first post, I hope it was helpful

Whenever I think of Front End projects, I think of them as one large UI project interacting with multiple different APIs. One main repository with code, catering for all of the different backend systems and services that it interacts with. Having a background that has been primarily focused in Backend technologies (such as PHP, Go, and Python) the idea of microservices is second nature. So naturally, when reviewing React and React Native code I find myself asking "Isn't this just a modern day monolith?" Talking over some of the ideas with my colleagues, I came across this blog post which seems to answer, or at the very least, guide my thinking, into micro-front ends. Really fascinating blog post. Thank you George Broadley for bringing it to my attention. Has anyone used this concept to break down front end work into different projects and repositories? What has been your experience of it? Should we think of multiple front end services like we do backend services? https://lnkd.in/gCN8HAS7 #microservices #frontend #react #reactnative

🎖 Advanced Frontend Web Dev Articles - Issue 3️⃣9️⃣ After the great #microfrontends #conference I immediately returned to the world of frontend development. In the last days I've collected another list of awesome #posts and #articles in the #frontend #webdev space. Enjoy reading! 1. I tried React Compiler today, and guess what... 😉 (https://lnkd.in/e2nTZE3K) by Nadia Makarevich 🇺🇦 Was it good? Was it?! Spoiler: It's not bad. 2. How Deep is Your DOM? (https://lnkd.in/e6rimCB2) by Maxi Ferreira I hope it's flat - flat is always good. 3. How React 19 (Almost) Made the Internet Slower (https://lnkd.in/eShr7xsR) by Henrique Yuji Nah, it just almost would have made any SPA using it slower. 4. Announcing the public preview of the Microsoft AI Chat Protocol library for JavaScript (https://lnkd.in/eEvU6yWx) by Rohit G. So you want to integrate an AI chat in your app? Here we go... 5. How To Hack Your Google Lighthouse Scores In 2024 (https://lnkd.in/ePTxMXXN) by Salma Alam-Naylor It's easy: Just don't put anything in. 6. Next.js 15: Unveil New Horizons in Web Development (https://lnkd.in/egkNRVnA) by Sagar Rathod This is the one that comes with React 19. 7. Generating ZIP Files with Javascript (https://lnkd.in/eu8sh29B) by Josh Martin Just follows Atwood's law: Any application that can be written in JavaScript, will eventually be written in JavaScript. 8. Blazor Basics: Blazor Render Modes in .NET 8 (https://lnkd.in/e65zqygH) by Claudio Bernasconi What I would wish for is another mode that pre-computes the changes as pure JS - leaving the business logic automatically on the server. 9. Enhance Your Tailwind CSS Skills: Essential Tips and Tricks (https://lnkd.in/eH5Tv2Qv) by Jeferson Amorim Don't apply - just use. 10. Server Islands (https://lnkd.in/epKUt8D6) by Fred Schott This is great, even though it's just a new name for something (partial caching) that exists already since 25+ years. 🙏 Many thanks to all authors for their hard work - much appreciated! 👉 Anything that you found useful? What are your top links for this issue? Let me know in the comments!

Exploring Front-End Libraries and Frameworks Front-end developers have a wide range of libraries and frameworks to choose from, each with its own strengths and applications. Among them, React, Angular, and Vue.js are the most popular, offering a variety of features for building engaging and interactive web interfaces. React is a declarative, component-based JavaScript library developed by Facebook. It's great for creating reusable UI elements and managing complex data structures. React uses a virtual DOM, which is a lightweight representation of the actual DOM, to efficiently update the page and provide smooth user interactions. Angular, from Google, is a full-fledged JavaScript framework that focuses on two-way data binding, dependency injection, and a component-based approach. It's designed for large-scale applications with complex data flows. Vue.js, created by Evan You, bridges the gap between React's flexibility and Angular's comprehensiveness. Its philosophy of "Progressively Enhancable JavaScript for building User Interfaces" allows developers to start with a simple setup and add complexity as needed. The choice of framework depends on the project's requirements and the developer's preferences. React is ideal for data-driven applications, Angular is well-suited for enterprise web applications, and Vue.js offers a flexible and structured approach. Thank you for reading my first post! I hope this brief overview has been helpful. I'll be exploring more advanced topics in future posts, so stay tuned!

🚀 Introducing HTMX: The Declarative Way of Building Web Applications 🌐 Are you tired of complex frontend frameworks? Meet HTMX, the lightweight library that lets you build dynamic web apps using HTML attributes! 🎉 With HTMX, you can say goodbye to complex JavaScript and hello to HTML engineering! 😄 #wantedsolutions #creativepioneers Read our latest article to learn more about HTMX, its pros and cons, and how it compares to popular frontend frameworks. We even demonstrate a simple use case using GoLang as the backend language! �golang Discover the power of declarative web development with HTMX. 💪 👉 Read the full article: https://lnkd.in/e-N6EFf4 #HTMX #WebDevelopment #FrontendFrameworks #Declarative #HTMLEngineering

🏁JavaScript for Backend: Transforming Web Development🛠️ JavaScript👑 is no longer just for making websites interactive. With the introduction of Node.js, it has become a powerful⛷️ tool for backend development too. This means you can use JavaScript to write server-side code, making the development process smoother and more efficient. 🚀The Start of Node.js Node.js was created in 2009 by Ryan Dahl. It uses Google's V8 JavaScript engine, which runs JavaScript in the Chrome browser, to execute code on servers. This was a game-changer, allowing JavaScript to be used outside of web browsers for the first time. 🔐Key Features of Node.js Node.js is known for its non-blocking, event-driven architecture. This means it can handle multiple tasks at the same time without waiting for one to finish before starting another. This makes it great for applications that need to handle many connections at once, like chat apps or real-time updates. 💡Popular Libraries and Frameworks Several popular tools make Node.js even more powerful: - 🌀Express.js: A simple and flexible framework for building web applications and APIs. - 🌀Koa: A modern framework designed to be smaller and more expressive than Express.js. - 🌀Hapi: A framework with a strong plugin system, great for building large applications. - 🌀Socket.io: Enables real-time communication between clients and servers. - 🌀Mongoose: Makes working with MongoDB databases easier. Why Node.js is Important❓ Node.js has turned JavaScript into a full-stack language, meaning you can use it for both frontend and backend development. Its ability to handle many tasks at once and its supportive ecosystem make it a top choice for modern web development. Node.js MongoDB #webdevelopment #javascript #google #nodejs #backend #linkdin #software

Summary: The blog post explores the development of serverless web applications using codehooks.io's serverless JavaScript, Handlebars, Tailwind CSS, and DaisyUI. It covers setting up the environment, efficient templating, handling form submissions with database integration, and deploying the application. Takeaway: This practical guide demonstrates an approach to create dynamic web applications without the complexities of SPA frameworks, emphasizing simplicity, speed, and ease of use with serverless architectures and traditional templating methods. Hashtags: #WebDevelopment #Serverless #JavaScript #Handlebars #TailwindCSS #DaisyUI #CodehooksIO #DynamicWebApplications #SPAFrameworks #WebDevelopmentTools

WebFormsJS is a JavaScript library that provides the infrastructure for interacting with web controls in the CodeBehind framework; this allows developers to easily manage HTML tags on the server-side. A New Architecture for Efficient Web Development Web development has always been a complex and time-consuming process, with multiple layers of complexity and numerous technologies to manage. WebFormsJS is a new JavaScript library that simplifies this process by providing a robust infrastructure for interacting with web controls (HTML tags) on the server-side, allowing developers to focus on server responses without worrying about the front-end. Using WebFormsJS eliminates the need for front-end development to a large extent. You will no longer need to use front-end frameworks such as React, Angular and Vue, and you will not even need to work with JavaScript on the front-end. Please note that the simultaneous use of WebFormsJS with front-end frameworks or JavaScript also gives many advantages to your project. ...

📈 Unleashing the Power of Node.js! 🚀🌐 Check out these mind-blowing stats that prove why Node.js is the heartbeat of modern web development! 💡👩💻 𝐍𝐨𝐝𝐞.𝐣𝐬 𝐒𝐭𝐚𝐭𝐢𝐬𝐭𝐢𝐜𝐬: 𝐓𝐡𝐞 𝐔𝐩𝐝𝐚𝐭𝐞𝐝 𝐆𝐮𝐢𝐝𝐞 𝐨𝐧 𝐍𝐨𝐝𝐞.𝐣𝐬 𝐔𝐬𝐚𝐠𝐞 𝐚𝐧𝐝 𝐓𝐫𝐞𝐧𝐝𝐬 ✅ Node.js Statistics of Usage Based on Various Parameters ✅ How do People Learn Node.js ✅ Additional Node.js Statistics #NodeJS #WebDev #JavaScript #TechStats #WebDevelopment #Programming