Рубрики
CSS HTML TextArea Теги

textarea внутри контейнера с табами

textarea встраивает свою высоту при изменении высоты контейнера с ограничением минимальной высоты и длинны

<div class="cont">
<div cass="tabs">tab</div>
<div cass="div">
<textarea></textarea>
</div>
</div>

<style>
.cont{  
min-width: 300px;
min-height: 280px;
}
.tabs{
height:10%;
}
.div{
height:90%;
}
textarea{
height:100%;
}
</style>
Рубрики
JavaScript lib Промесы

Async/await

Существует специальный синтаксис для работы с промисами, который называется «async/await». Он удивительно прост для понимания и использования.

Асинхронные функции

Async/await в JavaScript
Async/await
Рубрики
HTML Input Vue components Vue project Vue UI Теги

MyInput.vue

MyInput.vue

простой UI тег Input в HTML5, который реализуется в файле MyInput.vue как компонент

UI Input во HTML5 и реализация в MyInput.vue
тег Input
Рубрики
CSS CSS основы

Базовые свойства

//размещение элемента по вертикали (вверх)
vertical-align: top;
//размещение элемента по середине
vertical-align: middle;
//рамка контейнера
border: 1px solid black;
//при наведении на элемент появляется курсор
cursor: pointer;
Рубрики
CSS CSS основы

Синтаксис

//синтаксис id
#211018104515 {code} error
#211018104515_id {code} error
#211018104515-id {code} error
#id-211018104515 {code} successfully
//синтаксис class
.211018104515 {code} successfully
.211018104515-click {code} successfully
.click-211018104515 {code} successfully
Рубрики
JQuery Laravel+Vue3 project Vue компоненты Vue.js

Vue Окно в движении

JQuery

включить библиотеку из интернета
главный шаблон Laravel

resources\views\index.blade.php

<!DOCTYPE html>
<html lang="eng">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://codegid.ru/default/js/jquery/jquery-1.7.2.js"></script>
<script src="https://codegid.ru/default/js/jquery/jquery.event.drag-2.2.js"></script>
<script src="https://codegid.ru/default/js/jquery/jquery.event.drag.live-2.2.js"></script>
<script src="https://codegid.ru/default/js/jquery/ui/1.12.0/jquery-ui.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <body>
        <div id="app">
            <my-app/>
        </div>
        <script src="./js/app.js"></script>
    </body>
</html>
Рубрики
MobX React React основы

Иммутабельность данных

YouTube

  • концепция связана с тем, что если у нас есть какие то данные, например какой то объект или сложенная вложенная структура то в ней ключи или вложенные ключи или вообще данные не изменяются никогда
  • если мы хотим создать новую структуру мы должны создать новый объект и допустим в массиве подменить по ключику старый объект на новый
  • текущую структуру данных изменять никогда нельзя, и поэтому мы должны, не трогая структуру данных, создать хотя бы новый объект для начала
Рубрики
JavaScript lib Laravel React React-project

Соединение React c Laravel

OpenServer

установка laravel в локальный сервер через терминал

Рубрики
App CSS React React-project

Стилизация компонентов в React

styled-components
библиотека

Установка библиотеки через терминал

npm install --save styled-components

packge.json
добавляется библиотека

"dependencies":{
...
"styled-components":"^5.2.1",
...
}
Рубрики
ajax App Mockon React React-project Фронтенд

Запросы к Серверу в React

Mockon

сервис программа для эмуляции сервера