2026-03-08
React Native
2025-02-18
2024-12-27
rf
12V 28MHz
pamp
| ток | сопр | индук | вит | |
|---|---|---|---|---|
| 24 | 500 | 2.85 | 21.2 | |
| 120 | 100 | 0.57 | 7.2 | |
| 500 | 24 | 0.14 | 3 |
2024-12-15
2024-12-14
sdr
msi.sdr: sdrplay
https://groups.io/g/SDRPlayUsers/topic/rsp1_on_ubuntu_20_04_no_joy/91588947
https://github.com/pothosware/SoapySDRPlay3/wiki#troubleshooting
--------------------------
rtl-sdr: https://www.rtl-sdr.com/V4/ #Linux (Debian)
sudo apt-get install libusb-1.0
1412 sudo touch /etc/modprobe.d/rtl-sdr.conf
1417 sudo touch /etc/udev/rules.d/20.rtlsdr.rules
https://github.com/dernasherbrezon/rtlSpectrum?tab=readme-ov-file
2024-11-30
React Native
youtube: Codevolution,
Expo CLI vs React Native CLI
youtube:Programming with Mosh
VS Code plugins: React Native Tools, React-Native/React/Redux, Prettier,Material Icon Theme
Settings: formatonsave
npx expo run:android
https://docs.expo.dev/workflow/android-studio-emulator/#set-up-android-studio
expo init test1
npx expo run:android
./gradlew assembleDebug ? https://docs.expo.dev/workflow/android-studio-emulator/#set-up-android-studio
npx create-expo-app@latest npm run reset-project
2024-08-17
Links
https://nomadmania.com/my_map/
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1'); // Fetch data from API2024-08-06
Selenium
https://googlechromelabs.github.io/chrome-for-testing/#stable
unzip & copy to /opt/chromedriver
download latest chrome.deb;
sudo dpkg -i google-chrome-stable_current_amd64.deb
pom.xml:
<dependencies>
<!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>4.23.0</version>
</dependency>
</dependencies>
System.setProperty("webdriver.chrome.driver", "/opt/chromedriver");
WebDriver driver = new ChromeDriver();
driver.get("http://www.google.com");
2024-07-14
vscode
File-Prefs-Settings: Format on save
plugins: live server, runner, Quokka.js (plugins; gear icon->command palette-quokka, start on current file), esLint
2024-06-18
React forms
Working with form data in React can be approached in several ways, depending on the complexity of the form and the specific requirements of your application. Here are some common methods:
1. Controlled Components
In controlled components, form data is handled by the React component’s state. This is the most common method for managing form data in React.
Example
jsximport React, { useState } from 'react';
const ControlledForm = () => {
const [formData, setFormData] = useState({
name: '',
email: '',
});
const handleChange = (e) => {
const { name, value } = e.target;
setFormData((prevData) => ({
...prevData,
[name]: value,
}));
};
const handleSubmit = (e) => {
e.preventDefault();
console.log(formData);
};
return (
<form onSubmit={handleSubmit}>
<div>
<label>Name:</label>
<input
type="text"
name="name"
value={formData.name}
onChange={handleChange}
/>
</div>
<div>
<label>Email:</label>
<input
type="email"
name="email"
value={formData.email}
onChange={handleChange}
/>
</div>
<button type="submit">Submit</button>
</form>
);
};
export default ControlledForm;
2. Uncontrolled Components with Refs
Uncontrolled components store form data in the DOM itself and use refs to access the data. This approach is useful for simple forms or when integrating with non-React libraries.
Example
jsximport React, { useRef } from 'react';
const UncontrolledForm = () => {
const nameRef = useRef();
const emailRef = useRef();
const handleSubmit = (e) => {
e.preventDefault();
console.log({
name: nameRef.current.value,
email: emailRef.current.value,
});
};
return (
<form onSubmit={handleSubmit}>
<div>
<label>Name:</label>
<input type="text" ref={nameRef} />
</div>
<div>
<label>Email:</label>
<input type="email" ref={emailRef} />
</div>
<button type="submit">Submit</button>
</form>
);
};
export default UncontrolledForm;
3. Using Form Libraries
Form libraries like Formik and React Hook Form can simplify form management by handling validation, state, and submission more efficiently.
Formik Example
jsximport React from 'react';
import { Formik, Form, Field, ErrorMessage } from 'formik';
import * as Yup from 'yup';
const SignupForm = () => {
return (
<Formik
initialValues={{ name: '', email: '' }}
validationSchema={Yup.object({
name: Yup.string().required('Required'),
email: Yup.string().email('Invalid email address').required('Required'),
})}
onSubmit={(values, { setSubmitting }) => {
console.log(values);
setSubmitting(false);
}}
>
<Form>
<div>
<label htmlFor="name">Name:</label>
<Field name="name" type="text" />
<ErrorMessage name="name" component="div" />
</div>
<div>
<label htmlFor="email">Email:</label>
<Field name="email" type="email" />
<ErrorMessage name="email" component="div" />
</div>
<button type="submit">Submit</button>
</Form>
</Formik>
);
};
export default SignupForm;
React Hook Form Example
jsximport React from 'react';
import { useForm } from 'react-hook-form';
const HookForm = () => {
const { register, handleSubmit, formState: { errors } } = useForm();
const onSubmit = (data) => {
console.log(data);
};
return (
<form onSubmit={handleSubmit(onSubmit)}>
<div>
<label>Name:</label>
<input {...register('name', { required: 'Name is required' })} />
{errors.name && <span>{errors.name.message}</span>}
</div>
<div>
<label>Email:</label>
<input {...register('email', { required: 'Email is required', pattern: { value: /^\S+@\S+$/i, message: 'Invalid email address' } })} />
{errors.email && <span>{errors.email.message}</span>}
</div>
<button type="submit">Submit</button>
</form>
);
};
export default HookForm;
4. Custom Hooks
For more complex forms, you can create custom hooks to manage form state and validation logic.
Example
jsximport React, { useState } from 'react';
const useForm = (initialValues) => {
const [values, setValues] = useState(initialValues);
const handleChange = (e) => {
const { name, value } = e.target;
setValues((prevValues) => ({
...prevValues,
[name]: value,
}));
};
const resetForm = () => {
setValues(initialValues);
};
return [values, handleChange, resetForm];
};
const CustomHookForm = () => {
const [formData, handleChange, resetForm] = useForm({ name: '', email: '' });
const handleSubmit = (e) => {
e.preventDefault();
console.log(formData);
resetForm();
};
return (
<form onSubmit={handleSubmit}>
<div>
<label>Name:</label>
<input
type="text"
name="name"
value={formData.name}
onChange={handleChange}
/>
</div>
<div>
<label>Email:</label>
<input
type="email"
name="email"
value={formData.email}
onChange={handleChange}
/>
</div>
<button type="submit">Submit</button>
</form>
);
};
export default CustomHookForm;
Summary
- Controlled Components: Use when you want React to manage form state.
- Uncontrolled Components: Use when you prefer to keep form data in the DOM and access it with refs.
- Form Libraries (Formik, React Hook Form): Use for complex forms that require robust validation and state management.
- Custom Hooks: Use for custom form logic and state management.
