DevCodeLight

Select Dropdown Options Widget or DropdownButton in Dart using Flutter

by
Select Dropdown Options Widget or DropdownButton in Dart using Flutter

Tiempo de lectura: 2 minutos Today we are going to create a custom widget called CustomDropdownButton, which is used to display a DropdownButton with selectable options. The widget accepts three parameters: import ‘package:flutter/material.dart’; import ‘../comun/Option.dart’; class CustomDropdownButton extends StatefulWidget { final Option selectedOption; final List options; final void Function(Option?) onChanged; CustomDropdownButton({ required this.selectedOption, required this.options, required this.onChanged, }); @override _CustomDropdownButtonState … Read more

CSS Counter: Creating Elegantly Numbered Lists

by
CSS Counter: Creating Elegantly Numbered Lists

Tiempo de lectura: < 1 minuto Good morning, today I show you a brief example of how it would be: <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <link rel=”stylesheet” href=”styles.css”> <title>Numbered List</title> </head> <body> <ul class=”numbered-list”> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> </body> </html> By default, as we already know, this returns bullets. If … Read more

Add Google Sign Auth in Flutter

by
Add Google Sign Auth in Flutter

Tiempo de lectura: 4 minutos Today we are going to learn how we can implement Google authentication in our Flutter app. Let’s go to Google Cloud Platform (https://cloud.google.com/) and click on Console Now select our project (if we already have it created by Firebase) or create a new one. Now search for: oauth clients Choose External: Fill in the application … Read more

Verify Google Auth Token (Google Sign) Using Python

by
Verify Google Auth Token (Google Sign) Using Python

Tiempo de lectura: 2 minutos Today we’re going to learn how we can verify a token generated with Google Sign-In from a front-end client by sending it to the back-end. In this case, we’ll be using Python. Of course, here’s a step-by-step tutorial for validating a Google Sign-In token in Python using the google-auth library. Step 1: Install the google-auth … Read more

Create RadioGroup with RadioButtons using React with TypeScript

by
Create RadioGroup with RadioButtons using React with TypeScript

Tiempo de lectura: 2 minutos Let’s create a RadioGroup component composed of RadioButtons. First, we create the RadioGroup component. import React, { useState } from ‘react’; import RadioGroup from ‘./RadioGroup’; // Adjust the path according to your file structure import RadioButton from ‘./RadioButton’; // Adjust the path according to your file structure const YourComponent = () => { const [gender, … Read more

Crear un widget que pueda contener a otros widgets (ejemplo de custom card) con Flutter

by
Crear un widget que pueda contener a otros widgets (ejemplo de custom card) con Flutter

Tiempo de lectura: 1 minuto Today we are going to learn how to create a Widget that can contain other Widgets and be used as a background in Flutter. The first thing we are going to do is create our Widget which we will call CustomCard.dart It contains this code: import ‘package:flutter/material.dart’; class CustomCard extends StatelessWidget { final Widget? child; … Read more

Loading an XLS (Excel) File Using JavaScript in React

by
Loading an XLS (Excel) File Using JavaScript in React

Tiempo de lectura: < 1 minuto Today we are going to learn how we can load an Excel XLS file using React. The first thing we have to do is install the xlsx library: npm install xlsx Once installed, we create our loading function XLSLoader: import * as XLSX from ‘xlsx’; async function loadExcelData() { const response = await fetch(‘our_path_to_xls.xls’); const … Read more

Adding a Theme in React to Change Element Colors and Text Font.

by
Adding a Theme in React to Change Element Colors and Text Font.

Tiempo de lectura: < 1 minuto Reading Time: < 1 minute Hello, today we are going to learn how to add a theme to customize the colors displayed in the theme of our React website. For this tutorial, we will use Material UI. First, we install the necessary dependencies: npm install @mui/material @emotion/react @emotion/styled Now, let’s create our theme by creating … Read more