sunmeat

Content.jsx (родительская компонента):

import './Content.css';
import {useContext, useState} from 'react';
import {AppContext} from '../../contexts/AppContext.jsx';
import {MyButton} from '../mybutton/MyButton.jsx';

export function Content() {
    const {theme, user} = useContext(AppContext);
    // состояние для хранения количества кликов

sunmeat

import React from 'react';

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    };
    console.log('constructor');
  }

sunmeat

написать 2-3 класса, которые будут полезны для вашего будущего финального проекта по джаваскрипту (защита 06.06.2025).
постараться применить как можно больше особенностей синтаксиса джаваскрипт (паттерн mixin, деструктурирование и тд).

ЛИБО:

выполнить одно любое задание из 11, доступных по ссылкам:

https://materials.itstep.org/content/0fd326fe-d42a-4675-9567-5406be94a43b/ru

https://materials.itstep.org/content/a7d24cff-b237-4b2b-962f-68fc4f6bb8fb/ru

sunmeat

1. Почитать про систему прототипирования в JS:
https://learn.javascript.ru/function-prototype
https://learn.javascript.ru/native-prototypes

2. Выполнить первое или второе задание на выбор по ссылке: https://materials.itstep.org/content/4cff49e1-88fb-44a6-9b5d-f4ee836ef81c/ru
Использовать ключевое слово class, сделать три свойства и метод. В методе применить document.write() для генерации контента на странице.
Создать один или несколько объектов на основе класса, запустить метод, проверить что всё работает.
Ссылку на гист/репозиторий с решением прислать в комментарий к этому ДЗ. 

sunmeat

// utils.jsx:
export function add(a, b) { return a + b; }
export function subtract(a, b) { return a - b; }
export const PI = 3.14;

// another file
import { add } from './utils'; // импортируем только add
import { add, subtract, PI } from './utils'; // импортируем всё

// именованные экспорты — лучший выбор по умолчанию.

sunmeat

import React from 'react'
import './App.css'

function MyButton(props) {
    return (
        <button style={{ backgroundColor: props.color }}>
        Нажми меня
        </button>
    );
}

sunmeat

import React, {useState} from 'react'
import './App.css'

const getRandomColor = () => {
    const letters = '0123456789ABCDEF';
    let color = '#';
    for (let i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;

sunmeat

import React from 'react'
import './App.css'

function MyButton() {
    return <button>Hello</button>
}

function BorderedButton() {
    return (
        <div className="bordered">

sunmeat

import React, {useState} from 'react'
import reactLogo from './assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'


function MyButton() {
    return <button>Hello</button>
}

sunmeat

import {useState} from 'react'
import reactLogo from './assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'

function MyButton() {
    return <button>Hello</button>
}

function App() {