32 posts
How thinking in server-first component boundaries can simplify data flow and reduce client JavaScript in Next.js applications. When I first started working with the Next.js App Router, I kept running into the same situation. Components would suddenly break — usually after adding a hook or a click handler. The fix felt obvious: add "use client". But after doing this a…
null How to Test Accessibility Across Multiple Locales in React Apps. on SitePoint.
A behind-the-scenes look at how we built Maxima Therapy with playful interactions, creative code, and a little AI help along the way.
Mozilla and Filament have introduced Uniffi for React Native, a tool that allows developers to leverage the safety and performance benefits of Rust in cross-platform React Native apps. The post Introducing Uniffi for React Native: Rust-Powered Turbo Modules appeared first on Mozilla Hacks - the Web developer blog.
Update (October 2024): In response to numerous requests from external developers, we have open-sourced a version of our Enzyme to React Testing Library (RTL) conversion tool. You can now find it on npm, along with detailed instructions on how to integrate and use it in your projects. In the world of frontend development, one thing remains…
Writing testable code is a vital skill in software engineering. Let’s explore practical advice, strategies, and tactics for writing more testable code, unlocking the benefits of modularity, reusability, and high quality software in your projects. Embracing testability in your coding practice isn’t just about catching bugs; it’s about fostering a culture of quality and efficiency in your projects. A good…
The world of JavaScript has evolved significantly, and interview trends have changed a lot over the years. This guide features 10 essential questions that every JavaScript developer should know the answers to in 2024. It covers a range of topics from closures to TDD, equipping you with the knowledge and confidence to tackle modern JavaScript challenges. As a hiring manager,…
Six years ago, I wrote a summary of my experience working with Ember for a year. I had been with Cinch Financial for a year, building their web & mobile apps with Ember and Elixir/Phoenix. After Cinch I joined Salsify, a leader in the Ember ecosystem, and shipped some great products built with Ember during my five-year tenure. I built…
Me and my mentors Patrick & Nomnoms Introduction Hi, my name is Navika Budhraja and I’m a rising senior at UC San Diego studying Computer Science. This summer I was a web-frontend engineering intern on the Athlete Services team and consequently, got to learn a lot about how to develop athlete-facing products! During my internship, I worked with 3 other…
Learn how to create a private, invite-only website using Next.js, AirTable, custom React hooks, and Vercel deploy. The post covers backend APIs in Next.js, data storage with AirTable, validating access with invite codes, collecting user input, and deploying the final app.
Photo by Sen on Unsplash Modern JavaScript websites are the result of complex code bases, and the code base which powers BBC Online is no exception. There are many dependencies and frameworks that we rely upon in order to provide the functionality that our end-users expect, as well as code written in-house to cater to the needs of our website…
In this React-Native sound and animation tutorial, you'll learn tips on how you can add animation and sound effects to your mobile application. The post React-Native Sound & Animation Tutorial appeared first on RisingStack Engineering.
This article defies a lot of trending patterns, like: React hooks, avoiding mutable data, traditional dependency injection, and full front-end testing. The post Reinventing Hooks with React Easy State appeared first on RisingStack Engineering.
React Easy State is a transparent reactivity based state manager. It automagically decides when to render which components without explicit orders from you. The post Introducing React Easy State by RisingStack appeared first on RisingStack Engineering.
In this React-Native tutorial we'll learn how to do testing on both Android and iOS devices with Expo, and how to use Jest for unit testing. The post React-Native Testing with Expo, Unit Testing with Jest appeared first on RisingStack Engineering.
Handling data in React can be treacherous if you don’t know your way around. Learn some common patterns for fetching, storing, and retrieving data in this guide to help you avoid messy code traps. React’s flexibility means you can handle data in a lot of different ways. This guide will teach you patterns for fetching, storing, and retrieving data in…
One of the things I enjoy the most about coding is discovering patterns. Being aware and mindful of the patterns emerging in your codebase can make it easier to keep that codebase consistent, readable and easy to navigate. Most patterns will remain unspoken, and some, that prove notably elegant, are named and promoted as best practices. Others might even be…
Learn the basics of React-Native development. Become confident with built-in components, styling, storing persisting data, animating the UI & more.. The post A Definitive React-Native Guide for React Developers: Getting Started appeared first on RisingStack Engineering.
Proper state handling in React will make your components simple and maintainable. Poor choices will give you lots of headaches in the long-term. There are plenty of options for managing state in a React app. But there’s very little guidance about which one you should use in any situation. Let’s fix that. The solution you pick to manage state should…
This article shows how to quickly build web app prototypes using Fastify for the backend API and Preact for the frontend UI. It also covers how to dockerize the app for easy sharing. Key points are the plugin architecture of Fastify, the lightweight nature of Preact, and the use of htm for defining UI without transpilation.
This article explores how to simulate multiple return values in JavaScript using arrays and objects. It covers use cases like React Hooks and async/await error handling. The pattern enables elegant APIs but has performance implications.
“It works on my machine” is something you don’t want to experience in your team. This is especially true when working on a React Native Application as your team might consist of Android Experts, iOS Experts, and Javascript Experts. The all know their part of the development environment very well, but errors in other parts might seem very alien to…
Lately at work, my colleagues build some awesome tooling to fetch data in an easy way. It’s built around RxJS, which I previously had very little knowledge about. I saw cool ways of getting and combining data, which inspired me to build a little game with RxJS in React Native. The game idea is to have a ball on a…
One of the most exciting strengths of React Native is that it allows you to bridge native calls to Javascript. In contrast to other frameworks that pre-define what can be executed on the native side React Native is easily extensible. With great power comes great responsibility The React Native community is hard to compare with others, you have a lot…
The History of React.js on a timeline: 2010-2018. The post The History of React.js on a Timeline appeared first on RisingStack Engineering.
One pattern I’ve used quite a lot while working with React at the BBC and Discovery Channel is the Data Container pattern. It became popular in the last couple of years thanks to libraries like Redux and Komposer. The idea is simple. When you build UI components in React you feed data into them via […]
8 Tips & Tricks to build better React apps in 2018. Follow these best practices to become a better coder. Which one did you miss so far? The post 8 Tips to Build Awesome React.js Apps in 2018 appeared first on RisingStack Engineering.
Thanks to Bazaarvoice I recently attended an “Advanced React Workshop” put on by React Training and taught by Ryan Florence, one of the creators of React Router. Ryan was an engaging teacher and the workshop was filled with memorable quotes. Here are some highlights: The great conundrum of accessibility is that learning it is not […]
The author gave a talk on building universal JavaScript web apps at Codemotion Rome 2017. He updated his Judo Heroes demo to v2 with React 15.4, React Router 4, Webpack 2, and Express 5. The talk got positive feedback from the audience. Slides and video are linked.
This blog post summarizes a talk about building a Universal JavaScript application with React given at Codemotion Milan 2016. It includes commentary for each slide, photos from Twitter, and a video recording. The post explains what Universal JavaScript is, its benefits, challenges, and walks through demo code to add server-side rendering and routing to a React app.
This article explains how to build a simple Universal JavaScript application using React, React Router and Express. It shows how to implement server side rendering with React and Node.js to create an isomorphic app.
// type to search
