sunmeat

App.jsx:

import {useSelector, useDispatch, Provider} from 'react-redux';
import {configureStore, createSlice, createAsyncThunk} from '@reduxjs/toolkit';
import {useState} from 'react';
import './App.css';

// создание асинхронного thunk для имитации логина
export const loginUser = createAsyncThunk(
    'auth/loginUser', // имя действия

sunmeat

App.jsx:

import {useSelector, useDispatch, Provider} from 'react-redux';
import {configureStore, createSlice, createAsyncThunk} from '@reduxjs/toolkit';
import {useEffect} from 'react';
import './App.css';

// создание асинхронного thunk для имитации загрузки товаров
export const fetchProducts = createAsyncThunk(
    'cart/fetchProducts', // имя действия

sunmeat

import { configureStore, createSlice } from '@reduxjs/toolkit';
import { Provider, useSelector, useDispatch } from 'react-redux';
import { useState } from 'react';

// слайс для аутентификации
const authSlice = createSlice({
    name: 'auth',
    initialState: {
        user: null,
        isAuthenticated: false,

sunmeat

App.jsx:

import {useSelector, useDispatch, Provider} from 'react-redux';
import {configureStore, createSlice} from '@reduxjs/toolkit';
import {useState} from 'react';
import './App.css';

// создание среза (slice) для управления задачами
const todoSlice = createSlice({
    name: 'todo', // имя среза

sunmeat

App.jsx:

import {useSelector, useDispatch, Provider} from 'react-redux';
import {configureStore, createSlice} from '@reduxjs/toolkit';
import {useState} from 'react';
import './App.css';

// создание среза (slice) для управления задачами
const todoSlice = createSlice({
    name: 'todo', // имя среза

sunmeat

import { createStore } from 'redux';
import { Provider, useSelector, useDispatch } from 'react-redux';
// npm install redux react-redux

// редьюсер для счетчика
const counterReducer = (state = { count: 0 }, action) => {
    switch (action.type) {
        case 'INCREMENT':
            return { count: state.count + 1 };
        case 'DECREMENT':

sunmeat

App.jsx:

import {
    BrowserRouter,
    Routes,
    Route,
    NavLink,
    Link,
    Outlet,
    Navigate,

sunmeat

...

function NotFound() {
    return (
        <div className="page-content">
            <h1 className="page-title">404 - Страница не найдена</h1>
            <p className="about-text">Извините, запрашиваемая страница не существует.</p>
            <div className="link-group">
                <Link to="/" className="page-link">Вернуться в ленту</Link>
                <Link to="/profile" className="page-link">Профиль</Link>

sunmeat

App.jsx:

import {BrowserRouter, Routes, Route, NavLink, Link, Outlet, Navigate} from 'react-router';
import './App.css';
import {useState} from "react";

function Home() {
    return (
        <div className="page-content">
            <h1 className="page-title home-title">Лента</h1>

sunmeat

App.jsx:

import {BrowserRouter, Routes, Route, NavLink, Link} from 'react-router';
import './App.css';

function Home() {
    return (
        <div className="page-content">
            <h1 className="page-title home-title">Лента</h1>
            <div className="post">