🦜 Robin Wieruch - Freelance Web Developer
@www.robinwieruch.de@rss-parrot.net
I'm an automated parrot! I relay a website's RSS feed to the Fediverse. Every time a new post appears in the feed, I toot about it. Follow me to get all new posts in your Mastodon timeline!
Brought to you by the RSS Parrot.
---
Freelance Web Developer for React.js, Next.js and Node.js. Based in Berlin, German/English speaking. Consulting/Freelancing for Web Development project: Code Audits/Reviews, Workshops, Training, Implementation ...
Your feed and you don't want it here? Just
e-mail the birb.
LangChain: OpenAI in JavaScript with React.js & Next.js
https://www.robinwieruch.de/langchain-javascript-openai/
Published: January 13, 2025 06:50
How to: OpenAI in JavaScript with LangChain. A step by step example on how to use the OpenAI API in JavaScript with LangChain ...
React Folder Structure in 5 Steps [2025]
https://www.robinwieruch.de/react-folder-structure/
Published: January 8, 2025 05:52
React Folder Structure in 2025 for large React projects. The guide walks you through a file structure from small to large project ...
Mac Setup for Web Development [2025]
https://www.robinwieruch.de/mac-setup-web-development/
Published: January 7, 2025 04:50
How I set up my new M1 MacBook Pro as a web developer in 2025 for web development ...
React Router 7: Search Params (alias Query Params)
https://www.robinwieruch.de/react-router-search-params/
Published: January 6, 2025 05:52
How to: Search Params in React Router 7. A example on Search Params (also called Query Params) with React Router ...
React Router 7: Descendant Routes
https://www.robinwieruch.de/react-router-descendant-routes/
Published: January 6, 2025 05:52
How to: Descendant Routes in React Router 7. A step by step example on Descendant Routes with React Router ...
React Router 7: Nested Routes
https://www.robinwieruch.de/react-router-nested-routes/
Published: January 6, 2025 05:52
How to: Nested Routes in React Router 7. A step by step example on Nested Routes with React Router ...
React Router 7 Lazy Loading
https://www.robinwieruch.de/react-router-lazy-loading/
Published: January 6, 2025 05:52
How to: React Router 7 Lazy Loading: code-splitting at route level helps you lazy-load just the things that are needed by the user, which dramatically improves the performance ...
React Router 7: Authentication
https://www.robinwieruch.de/react-router-authentication/
Published: January 6, 2025 05:52
You will learn how to use authentication in React Router 7 by authenticating a user by login (sign in) and logout (sign out) ...
React Router 7: Example
https://www.robinwieruch.de/react-router-example/
Published: January 6, 2025 05:52
A brief React Router 7 example to get you started ...
React Router 7: Redirect
https://www.robinwieruch.de/react-router-redirect/
Published: January 6, 2025 05:52
How to: Redirect in React Router 7 by using the declarative Navigate component or the programmatic useNavigate Hook ...
React Router 7: Private Routes (alias Protected Routes)
https://www.robinwieruch.de/react-router-private-routes/
Published: January 6, 2025 05:52
How to use Private Routes in React Router 7 (alias Protected Routes) by using conditions (e.g. authentication, permissions, roles) to authorize users for guarded pages ...
React Router 7 Tutorial
https://www.robinwieruch.de/react-router/
Published: January 6, 2025 05:52
React Router 7 tutorial: setup, hooks, nested routes, dynamic routes, programmatic navigation, active links, layout routes, index routes and more. A step by step React tutorial for beginners ...
React Function Components
https://www.robinwieruch.de/react-function-component/
Published: December 23, 2024 05:50
Everything you need to know about React Function Components, also known as React Functional Components. Here you will learn React Function Components by example with step by step ...
React Form Validation
https://www.robinwieruch.de/react-form-validation/
Published: December 16, 2024 05:50
How to validate forms in React without a form library on the server and the client ...
React Tech Stack [2025]
https://www.robinwieruch.de/react-tech-stack/
Published: December 9, 2024 05:50
Popular React Tech Stack for Full-Stack Applications in 2025 to create your product (i.e. SaaS) ...
React Data Fetching Patterns
https://www.robinwieruch.de/react-data-fetching-patterns/
Published: December 2, 2024 05:50
Data fetching patterns for React components across Client and Server Components ...
Feature-based React Architecture
https://www.robinwieruch.de/react-feature-architecture/
Published: November 25, 2024 05:50
How to create a feature-based React architecture that allows large scale applications ...
React and FormData
https://www.robinwieruch.de/react-form-data/
Published: November 11, 2024 04:50
Learn how to handle FormData in React when submitting it with a (Server) Action to the server ...
Freelance Web Developer: Charge by Time, not Value
https://www.robinwieruch.de/freelance-developer-rate/
Published: November 4, 2024 11:50
Freelance Developers have to rate their services by time or by value. Here I, as a freelance React developer, want to argue in favor of charging by time ...
How to (not) reset a form after a Server Action in React
https://www.robinwieruch.de/react-server-action-reset-form/
Published: November 4, 2024 06:50
Learn how not to reset a form after a erroneous server action in React. In other words, how to opt-out of the default form reset behavior in React ...
About Me
https://www.robinwieruch.de/about/
Published: October 30, 2024 13:35
Freelance React Developer for React and Next.js in JavaScript/TypeScript from Berlin (German/English). Consulting & Freelancing for Web Development: Full-Stack Applications, Code Audits & Reviews, Workshops, Training, MVPs ...
How to roll your own auth in JavaScript & TypeScript
https://www.robinwieruch.de/how-to-roll-your-own-auth/
Published: October 29, 2024 10:50
Learn how to roll your own authentication in JavaScript & TypeScript ...
Authentication in Next.js
https://www.robinwieruch.de/next-authentication/
Published: October 29, 2024 10:50
Learn how to roll your own authentication in Next.js ...
How to fetch data with React Hooks
https://www.robinwieruch.de/react-hooks-fetch-data/
Published: October 21, 2024 11:50
Learn the fundamentals about data fetching in client-side React with React Hooks ...
How to Drag and Drop in React
https://www.robinwieruch.de/react-drag-and-drop/
Published: October 10, 2024 04:56
A tutorial about using Drag and Drop in React by example for a vertical list (later horizontal list) with @hello-pangea/dnd as DnD library ...
How to create a React Dropdown
https://www.robinwieruch.de/react-dropdown/
Published: October 7, 2024 11:56
How create a React Dropdown component by example. The HTML select element displays a menu ...
Types of React Components [2024]
https://www.robinwieruch.de/react-component-types/
Published: September 30, 2024 05:50
There are many types of React Components that make it difficult for React beginners. This tutorial goes through each React Component Type by example ...
How to fetch data in React [2024]
https://www.robinwieruch.de/react-fetching-data/
Published: September 23, 2024 11:50
There are different ways to fetch data in React from a remote API. In this guide we want to explore all the options available for data fetching in React ...
Search Params in Next.js for URL State
https://www.robinwieruch.de/next-search-params/
Published: September 10, 2024 06:50
How to use Search Params in Next with useSearchParams und SearchParams from React Server Components and Client Components for URL state ...
React is (becoming) a Full-Stack Framework
https://www.robinwieruch.de/react-full-stack-framework/
Published: August 20, 2024 06:50
React with Server Components and Server Actions is becoming a full-stack framework. This article reflects on the evolution of React and its impact on full-stack development ...
Data Fetching with Server Actions in Next.js
https://www.robinwieruch.de/next-server-actions-fetch-data/
Published: July 22, 2024 06:50
Can I fetch data with Server Actions in Next.js? There are different ways to fetch data. Normally Server Actions are used to mutate data, but ...
React Form Button
https://www.robinwieruch.de/react-form-button/
Published: July 15, 2024 05:50
Learn how to trigger a server action with a form button without using a Client Component in React ...
Extra Arguments for Server Actions in React Forms
https://www.robinwieruch.de/react-form-server-action-extra-arguments/
Published: July 2, 2024 05:50
Learn how to pass extra arguments to server actions in React forms (or Next.js forms) using hidden form fields or binding the arguments to the server action ...
JavaScript Rounding Errors (in Financial Applications)
https://www.robinwieruch.de/javascript-rounding-errors/
Published: June 24, 2024 05:50
Learn about rounding errors in JavaScript and how to avoid them in financial applications. Why is 0.1 + 0.2 not equal to 0.3 in JavaScript when working with floating-point numbers?
React Form with Loading State (Pending Action)
https://www.robinwieruch.de/react-form-loading-pending-action/
Published: June 17, 2024 05:50
Learn how to add a loading state to React forms when using actions. Show a loading spinner while the form is submitting ...
Server Actions in Next.js
https://www.robinwieruch.de/next-server-actions/
Published: April 9, 2024 06:50
Learn how to use Server Actions in Next.js in React Server Components to create a full-stack application ...
Next.js with Prisma and SQLite
https://www.robinwieruch.de/next-prisma-sqlite/
Published: March 21, 2024 06:50
Learn how to use Prisma with SQLite in a Next.js application ...
Seeding a Database with Prisma (TypeScript)
https://www.robinwieruch.de/prisma-seeding-database/
Published: March 21, 2024 06:50
Learn how to seed a database with Prisma in a TypeScript application ...
Next.js Forms with Server Actions
https://www.robinwieruch.de/next-forms/
Published: February 27, 2024 06:50
How to use Forms in Next.js with React Server Components (RSC), Server Actions in Next's App Router by using useFormState and useFormStatus. Learn about form validation, form reset, form feedback (field errors and toast messages) while using progressive…
React Trends in 2024
https://www.robinwieruch.de/react-trends/
Published: February 20, 2024 06:50
React Trends in 2024 which should be on your watchlist. A walkthrough of the state of React ...
How to start a React Project in 2024
https://www.robinwieruch.de/react-starter/
Published: January 23, 2024 05:52
A list of React starter kits (Vite, Next, Astro) which help developers to start a React project in 2024 ...
React Libraries for 2024
https://www.robinwieruch.de/react-libraries/
Published: January 15, 2024 06:50
Discover the essential React libraries for 2024! Navigate the vast ecosystem effortlessly with this curated list. Empower your React projects with these powerful tools for seamless development of large-scale applications ...
Freelance React Developer
https://www.robinwieruch.de/work-with-me/
Published: January 1, 2024 11:50
Freelance React Developer for React and Next.js in JavaScript/TypeScript from Berlin (German/English). Consulting & Freelancing for Web Development: Full-Stack Applications, Code Audits & Reviews, Workshops, Training, MVPs ...
How to learn a JavaScript Framework
https://www.robinwieruch.de/how-to-learn-framework/
Published: January 1, 2024 11:50
How to learn React, Vue, Angular or any other framework? For many developers this question pops up every day. The article should give actionable guidance on how to escape the analysis paralysis and how to get from consuming to producing by following a…
How to setup React.js on Windows
https://www.robinwieruch.de/react-js-windows-setup/
Published: January 1, 2024 11:50
A step by step guide on how to setup React.js on Windows for your PC. You will install Visual Studio Code, Node.js, NPM, Git, Prettier and create-react-app for building React applications with Windows ...
How to setup React.js on MacOS
https://www.robinwieruch.de/react-js-macos-setup/
Published: January 1, 2024 11:50
A step by step guide on how to setup React.js on MacOS. You will install Visual Studio Code, Node.js, NPM, Git, Prettier and create-react-app for building React applications with Mac OS ...
Web Development Setup for Beginners
https://www.robinwieruch.de/developer-setup/
Published: January 1, 2024 11:50
A minimal web developmment setup for beginners who want to start their career as web developers ...
Vite with TypeScript
https://www.robinwieruch.de/vite-typescript/
Published: January 1, 2024 07:52
How to upgrade Vite to TypeScript from JavaScript ...
How to learn React
https://www.robinwieruch.de/learn-react-js/
Published: January 1, 2024 05:52
How to learn React and how to become a React developer. A step by step guide on how to learn React, on how to get started, and how to commit yourself every day ...
How to learn React in 2024
https://www.robinwieruch.de/learning-react/
Published: January 1, 2024 05:52
Learning React in 2024 as a library or framework is not an easy decision. Whether to learn React with Next.js as a framework ...
Migrate to Vite from Create React App (CRA)
https://www.robinwieruch.de/vite-create-react-app/
Published: March 29, 2023 07:52
How to migrate to Vite from Create React App (CRA) with environment variables, testing, SVG, ESLint, TypeScript ...
Full-Stack TypeScript with tRPC and React
https://www.robinwieruch.de/react-trpc/
Published: March 6, 2023 06:50
How to use tRPC with React for full-stack type safety with TypeScript ...
Vite with ESLint
https://www.robinwieruch.de/vite-eslint/
Published: February 4, 2023 07:52
How to use ESLint in Vite with vite-plugin-eslint for a better code style linting ...
10 Web Development Trends in 2023
https://www.robinwieruch.de/web-development-trends/
Published: January 25, 2023 06:50
Web Development Trends in 2023 which should be on your watchlist. A walkthrough of the state of JS ...
React Cross Fade for Material UI (MUI)
https://www.robinwieruch.de/react-cross-fade-material-ui-mui/
Published: December 14, 2022 05:56
A React Cross Fade component for Material UI (MUI) ...
React Testing Library Tutorial
https://www.robinwieruch.de/react-testing-library/
Published: November 22, 2022 05:52
Learn how to use React Testing Library in this tutorial. You will learn how to test your React components step by step with unit and integration tests ...
React Component with TypeScript
https://www.robinwieruch.de/typescript-react-component/
Published: November 15, 2022 14:56
Learn how to use TypeScript for a React component by example for type safe props and a type safe render ...
TypeScript with Node.js
https://www.robinwieruch.de/typescript-node/
Published: November 8, 2022 03:50
A TypeScript with Node.js setup which helps you with tsc (TypeScript compiler), ts-node (on the fly compilation), @types/node, and nodemon ...
React Nested Dropdown for Material UI (MUI)
https://www.robinwieruch.de/react-nested-dropdown-material-ui-mui/
Published: November 1, 2022 05:56
A React Dropdown component for Material UI (MUI) with a nested menu ...
React Dropdown for Material UI (MUI)
https://www.robinwieruch.de/react-dropdown-material-ui-mui/
Published: October 25, 2022 05:56
A React Dropdown component for Material UI (MUI) ...
How to create a React Select
https://www.robinwieruch.de/react-select/
Published: October 16, 2022 10:56
How create a React Select component by example. The HTML select element displays a menu ...
TypeScript: Type Guards
https://www.robinwieruch.de/typescript-type-guard/
Published: October 11, 2022 04:52
How to use type guards in TypeScript. You will learn how to check for types (and interfaces) by using user defined type guards ...
Vitest with React Testing Library
https://www.robinwieruch.de/vitest-react-testing-library/
Published: October 3, 2022 07:52
Learn how to use React Testing Library with Vitest in Vite. React Testing Library is a popular testing library for writing tests in React applications ...
TypeScript: Generics
https://www.robinwieruch.de/typescript-generics/
Published: August 30, 2022 04:52
How to use generics in TypeScript. You will learn how to create a arrow function which uses a generic type to infer the type for the parameter from the passed argument ...
How to use Forms in React
https://www.robinwieruch.de/react-form/
Published: August 16, 2022 04:52
How to use Forms in React by example. You will learn how to create a form template in a React functional component with validation to submit data ...
TypeScript: React useState Hook
https://www.robinwieruch.de/typescript-react-usestate/
Published: August 2, 2022 06:52
How to use React's useState Hook with TypeScript by automatically inferring the type or by manually using type assertion ...
TypeScript: React useRef Hook
https://www.robinwieruch.de/typescript-react-useref/
Published: July 19, 2022 04:52
How to use React's useRef Hook with TypeScript for using a ref ...
Embrace the Grind
https://www.robinwieruch.de/embrace-the-grind/
Published: June 22, 2022 05:52
Embrace the grind is about the intersection of entrepeneurship and gaming ...
React Element vs Component
https://www.robinwieruch.de/react-element-component/
Published: June 14, 2022 05:52
What are React Elements, Components, and Instances? A step by step explanation for a better ...
Monorepos in JavaScript & TypeScript
https://www.robinwieruch.de/javascript-monorepos/
Published: May 31, 2022 07:52
A tutorial how to use a monorepo architecture in frontend JavaScript and TypeScript with tools like npm/yarn/pnpm workspaces, Turborepo/NX/Lerna, Git Submodules, ...
Web Applications 101
https://www.robinwieruch.de/web-applications/
Published: May 16, 2022 09:52
Everything you need to know about web applications in modern web development. You will learn about traditional websites, full-stack web applications, client-side and server-side rendering/routing, single-page applications, code splitting, APIs,…
React "as" Prop
https://www.robinwieruch.de/react-as-prop/
Published: May 10, 2022 08:52
Using the "as" prop in React, also called "component" or "variant" prop, enables React developers to combine semantics with aesthetics in a flexible way ...
React Batching
https://www.robinwieruch.de/react-batching/
Published: April 25, 2022 05:52
Learn about batching in React. Batching means that multiple state updates are batched as one update + render operation for an improved performance ...
React Higher-Order Components (HOCs)
https://www.robinwieruch.de/react-higher-order-components/
Published: April 19, 2022 05:50
A comprehensive tutorial about Higher-Order Components in React. Higher-Order Components, known as HOCs, are often a difficult to understand pattern in React.js. The article gives you a gentle introduction, how to use HOCs in an elegant way, how to…
How to create a React Button
https://www.robinwieruch.de/react-button/
Published: April 12, 2022 03:56
How create a React Button component by example. The HTML button element uses onClick ...
React: How to create a Custom Hook
https://www.robinwieruch.de/react-custom-hook/
Published: April 6, 2022 03:52
How to create a custom hook in React. A step by step tutorial which walks you through an example ...
Local Storage in React
https://www.robinwieruch.de/local-storage-react/
Published: April 6, 2022 02:52
Learn how to use the local storage in React to store state by using a React Hook called useLocalStorage ...
React Hook: Get Scrollbar Width
https://www.robinwieruch.de/react-hook-scrollbar-width/
Published: April 5, 2022 05:52
A custom React hook by example to get the width of the scrollbar ...
React Hook: useLocalStorage
https://www.robinwieruch.de/react-uselocalstorage-hook/
Published: April 5, 2022 05:52
How to store state in local storage in React by using a custom useLocalStorage hook ...
React Hook: Detect Click outside of Component
https://www.robinwieruch.de/react-hook-detect-click-outside-component/
Published: April 4, 2022 05:52
How to detect a click outside of a React component by creating a custom hook for it ...
React Hook: Detect Scroll Direction
https://www.robinwieruch.de/react-hook-scroll-direction/
Published: March 29, 2022 05:52
A React hook by example that checks the scroll direction -- in a vertical direction, but potentially also in a horizontal direction ...
How to use Props in React
https://www.robinwieruch.de/react-pass-props-to-component/
Published: March 25, 2022 11:50
Everything you need to know about props in React. How to pass props to components, how to set default props, how to know the difference between props and state, and how to pass components or functions as props, ...
How to: React Table with fixed Column
https://www.robinwieruch.de/react-table-fixed-column/
Published: March 14, 2022 11:56
How to use React Table Library with a fixed column. Also called a sticky column, can be enabled in React Table with ...
Creating a REST API with Express.js and PostgreSQL
https://www.robinwieruch.de/postgresql-express-node-rest-api/
Published: February 19, 2022 06:50
A Node.js with Express and PostgreSQL tutorial to learn step by step how to create a REST API for CRUD operations which can be consumed by a client application ...
Setup PostgreSQL with Sequelize in Express
https://www.robinwieruch.de/postgres-express-setup-tutorial/
Published: February 19, 2022 05:50
A tutorial on how to setup PostgreSQL for Express.js in a Node.js application. It comes with the database installation and how to connect it to Express with Sequelize as ORM. You can choose to use another ORM, if you want to ...
How to use Prettier with ESLint
https://www.robinwieruch.de/prettier-eslint/
Published: February 14, 2022 06:50
How to combine Prettier and ESLint for VSCode, Sublime, or any other IDE/editor. You will get to know the ESLint Prettier Rules that are needed to get you started ...
How to use ESLint in VSCode
https://www.robinwieruch.de/vscode-eslint/
Published: February 14, 2022 05:50
How to install ESLint for VS Code (Visual Studio Code). Install ESLint, configure it per project, and use a local .prettierrc file ...
How to use Prettier in VS Code
https://www.robinwieruch.de/how-to-use-prettier-vscode/
Published: February 14, 2022 04:50
How to install Prettier for VS Code (Visual Studio Code). Install Prettier, configure it globally to format on save, add further Prettier configuration on a global level, and use a local .prettierrc file ...
React: Event Bubbling and Capturing
https://www.robinwieruch.de/react-event-bubbling-capturing/
Published: January 10, 2022 05:52
Event bubbling in React explained with examples. You will learn how to prevent events from bubbling, how to capture events before the bubbling, and how to access the target and currentTarget ...
React Hook: Check if Overflow
https://www.robinwieruch.de/react-custom-hook-check-if-overflow/
Published: December 21, 2021 05:52
A React hook by example that checks if an element's content has overflow (scroll) ...
How to create a React Radio Button
https://www.robinwieruch.de/react-radio-button/
Published: October 8, 2021 11:57
How to use a radio button in React by example and how to create a React Radio Component ...
React Router: Redirect with Higher-Order Component
https://www.robinwieruch.de/react-redirect-higher-order-component/
Published: October 6, 2021 05:52
A reusable higher-order component to redirect with React Router ...
Image from React Component (JPG or PNG)
https://www.robinwieruch.de/react-component-to-image/
Published: September 26, 2021 05:52
How to generate an image from a React component by extracting it as JPG or PNG ...
PDF from React Component
https://www.robinwieruch.de/react-component-to-pdf/
Published: September 26, 2021 05:52
How to print a PDF from a React component and download it as PDF by generating ...
Conditional ClassName in React
https://www.robinwieruch.de/react-conditional-classname/
Published: August 8, 2021 05:52
How to use conditional classnames in React with JSX and the HTML class attribute (clsx) ...
How to: React Tree Table
https://www.robinwieruch.de/react-tree-table/
Published: August 1, 2021 11:56
How to create a React Tree, a React Tree View, or a React Tree List by using React Table Library ...
How to: React Table with Select
https://www.robinwieruch.de/react-table-select/
Published: July 26, 2021 11:56
How to use React Table Library with Select by using its useRowSelect plugin for selecting single or multiple rows in a table by checkbox or row click ...
How to: React Table with Double Click
https://www.robinwieruch.de/react-table-double-click/
Published: July 20, 2021 11:56
How to use React Table Library with a double click on a row ...
Conditional Hooks in React
https://www.robinwieruch.de/react-conditional-hooks/
Published: July 18, 2021 01:55
Is it possible to use conditional React Hooks in React components? Technically no. However, in this example I want to show you how to use a Hook ...
Freelance React Developer Checklist
https://www.robinwieruch.de/freelance-react-developer/
Published: July 11, 2021 11:50
How do I start freelancing as a React developer? This checklist helps freelancers and companies hiring freelancers to negotiate the details of the project ...
~ 240 additional posts are not shown ~