Create a Web Interface with React and Blueprintjs

We are going to create a Desktop App using web tecnologies. Here a list of tools we are going to use: - node js - vite - blueprint js - CSS Grid - electron js Setup First thing first, we will install the lastest stable node environment. Download and install Node from the official website https://nodejs.org/ Once installed text your setup with the following command node --version v20.11.0 We start our new project using the vite framework...

August 19, 2022 · 2 min · Sabbadin Stefy

React - To-do App in React

Let’s write a simple To-Do app with React-js. We’ll create components for adding, displaying, and deleting tasks. Project Structure: your-todo-app/ ├── node_modules/ ├── public/ │ ├── index.html │ └── ... ├── src/ │ ├── components/ │ │ ├── TodoList.js │ │ ├── TodoItem.js │ │ └── TodoForm.js │ ├── App.js │ ├── index.js │ └── ... ├── package.json └── ... Steps: Create TodoItem Component: // src/components/TodoItem.js import React from 'react'; function TodoItem({ task, onDelete }) { return ( <div> <span>{task}</span> <button onClick={onDelete}>Delete</button> </div> ); } export default TodoItem; Create TodoList Component:...

February 18, 2022 · 2 min · Sabbadin Stefy

React - Start a React-application

Writing a React.js app involves several steps, from setting up your development environment to deploying the app. Here’s a step-by-step guide to help you create a basic React.js app: Prerequisites: 1. Node.js and npm: Make sure you have Node.js and npm (Node Package Manager) installed on your machine. You can download them from https://nodejs.org/ 2.Create React App: React provides a tool called Create React App that sets up a new React project with a good default configuration....

February 12, 2022 · 3 min · Sabbadin Stefy

React - Setup React development environment

React is one of the most popular frontend framework, and for a good reason. It allow you to build your frontend application using components. Which are elements that encapsulate functionalities, visual elements, and data, into single units, that you can reuse, like lego blocks. Allowing you to organize and nest your components into a large and articulate application. Setup To start developing your react app, you will need to install some tools:...

August 19, 2021 · 2 min · Sabbadin Stefy