Михаил Р.

breakpoints.scss:

$breakpoint_sm: 300px;
$breakpoint_md: 700px;
$breakpoint_xl: 1000px;

BestComponent.scss:

@import "breakpoints";

@media screen and (max-width: $breakpoint_md) {
  // ...
}

index.scss:

@import "fonts";
@import "breakpoints";

_app.tsx:

import { FC } from "react";
import { AppProps } from "next/app";
import "./styles/index.scss";

const App: FC<AppProps> = ({ Component, pageProps }) => (
  <Component {...pageProps} />
);

export default App;

Если Вы пишите "реактивные" приложения, то я бы рекомендовал уходить от классического css/scss к css-in-js, например используя emotion.js.

Но тут видите, мы все равно подключаем
Dmitrijs Balcers "breakpoints"; в BestComponent, а надо без импорта, сразу

В случае с SCSS переменными, они не могут быть доступны глобально без импорта, как это возможно с CSS переменными, которые определены в :root. Это ограничение SCSS и его способа компиляции в CSS.

Варианты:
- Использовать переменные :root:

:root {
  --breakpoint-sm: 300px;
  --breakpoint-md: 700px;
  --breakpoint-xl: 1000px;
}

@media screen and (max-width: var(--breakpoint-md)) {}

- Использовать sass-loader в webpack для автоматического импорта переменных в каждый файл:

{
  test: /\.scss$/,
  use: [
    "style-loader",
    "css-loader",
    {
      loader: "sass-loader",
      options: {
        additionalData: `@import "path/breakpoints.scss";`
      }
    }
  ]
}

- Использовать css-in-js и не изобретать велосипеды.

Можно ли обойтись без неё

Можно, законом не запрещено.

или же это может хоть и маленьким, но фактором роста?

Да.

UPD:

Так нет, я же не xml карту имел ввиду, а html

Если все Ваши страницы хорошо перелинкованы, то смысла в "html-карте" нет, но xml-карта по прежнему актуальна.

Исходя из тега CSS GRID, и достаточно "не точного тз", ответ будет примерно такой (если я не правильно понял тз, то пример работы колонки "Описание заказа" - подскажет, как работать с другими колонками и рядами):


HTML:

<div class="order">
  <div class="order__item order__item-number">Номер заказа</div>
  <div class="order__item order__item-sum">Сумма</div>
  <div class="order__item order__item-status">Статус заказа</div>
  <div class="order__item order__item-transport">Транспортная компания</div>
  <div class="order__item order__item-description">Описание заказа</div>
  <div class="order__item order__item-buttons">Кнопки</div>
</div>

CSS:

/* desktop */

.order {
  display: grid;
  grid-template-columns: 1fr 1fr; /* two columns */
}

.order__item {
  border: 1px solid black;
  padding: 10px;
}

/* first column */
.order__item-number,
.order__item-sum {
  grid-column: 1;
  background-color: #f2f2f2;
}

/* two column */
.order__item-status,
.order__item-transport,
.order__item-description,
.order__item-buttons {
  grid-column: 2;
  background-color: #e6e6e6;
}

/* modile */

@media (max-width: 768px) {
  .order__item-description {
    grid-column: 1 / span 2; /* span two columns */
    background-color: #d4d4d4;
  }
}

Очистка title у изображений из колонки post_title:

UPDATE wpaq8a_posts SET post_title = '' WHERE post_mime_type = 'image/jpeg';

Если параметры динамически изменяются в зависимости от действий пользователя с интерфейсом (фильтры, пагинация итп.), статическая генерация не лучший вариант. В таком случае, лучше использовать хуки useState и useEffect для хранения и изменения get параметров, и последующего выполнения запроса к API.

Но если прям невтерпеж, то, как вариант:

export const getServerSideProps = async (context) => {
  const page = context.query.page || 1;
  
  try {
    const res = await axios.get(`tracks?page=${page}`);
    return {
      props: {
        tracks: res.data.items,
      },
    }
  } catch (e) {
    return {
      notFound: true,
    }
  }
}

export const getStaticProps = async (context) => {
  const page = context.params.page;
  // code
}

Как создать ярлык программы с «тихим» запуском?
Там есть пример добавления в автозагрузку. Вам потребуется создать отдельный скрипт, который добавит Ваш основной скрипт в автозагрузку.

UPD, Добавление программы в автозагрузки в regedit на python:

import winreg

# Добавляем в автозагрузку
def add_to_startup(program_name, executable_path):
    # Реестр
    registry_path = winreg.HKEY_CURRENT_USER
    key_path = r'SOFTWARE\Microsoft\Windows\CurrentVersion\Run'
    
    try:
        # Открываем ключ реестра для записи
        with winreg.OpenKeyEx(registry_path, key_path, 0, winreg.KEY_WRITE) as registry_key:
            # Создание или обновление реестра
            winreg.SetValueEx(registry_key, program_name, 0, winreg.REG_SZ, executable_path)
        print(f"{program_name} добавлена в автозагрузку.")
        
    except PermissionError:
        print("Нужны админские права.")
        
# Проверка программы в автозагрузке
def check_startup_entry(program_name):
    registry_path = winreg.HKEY_CURRENT_USER
    key_path = r'SOFTWARE\Microsoft\Windows\CurrentVersion\Run'
    
    try:
        # Открываем ключ реестра для чтения
        with winreg.OpenKeyEx(registry_path, key_path, 0, winreg.KEY_READ) as registry_key:
            program_path, regtype = winreg.QueryValueEx(registry_key, program_name)
        print(f"{program_name} уже добавлена в автозагрузку с путем: {program_path}")
        
    except FileNotFoundError:
        print(f"{program_name} не найдена в автозагрузке.")

if __name__ == "__main__":
    program_name = "GodzillaSoft"
    program_path = r"C:\path\GodzillaSoft.exe"
    
    check_startup_entry(program_name)
    add_to_startup(program_name, program_path)

Важно! Добавление программы в автозагрузку без явного согласия пользователя может считаться вредоносным действием. А так же, осторожнее с реестром, можно одним запуском скрипта наломать много дров...

Как создать ярлык программы с «тихим» запуском?
Если Вам не нужен тихий запуск, то уберите его.

Failed to execute 'atob' on 'Window': The string to be decoded contains characters outside of the Latin1 range

В строке имеются символы, которые не поддерживаются в функции atob. Можно предварительно проверять строку на символы, либо можно попробовать так:

const d = (name, blob) => {
    const url = URL.createObjectURL(blob);
    // code
}

Как вариант:
1. Создать А-запись с ip сервера.
2. На сервер поставить обратный прокси, например Nginx, в котором прописать правила, откуда брать инфу, если зайдут на указанный домен, например на контейнер докера с портом 3000.
3. Запустить контейнер докера с портами 8080>3000 (внешним и внутренним соответственно). Flask приложение в контейнере должно слушать 3000 порт (либо изменить во всех случаях на тот, который слушает).
4. Выпустить SSL для домена, затем дописать в Nginx правило обработки https.
5. Проверить файервол, чтобы разрешал локальный трафик на 127.0.0.1:3000.

Кстати, замечал множество раз у новичков, что они создавали правила в файерволе, а после перезагрузки сервера - правила разумеется возвращались на дефолтные, так вот - нужно сохранить эти правила в файл, затем заставить файервол при перезагрузке - брать эти правила из этого файла.

from bs4 import BeautifulSoup

html = '''
<tr align="center"><td><a href="#0">KEY 0</a></td></tr>
<tr align="center"><td><a href="#1">KEY 1</a></td></tr>
'''

bs = BeautifulSoup(html, 'html.parser')

for item in bs.find_all('a'):
    value = item.get('href')
    if value and value.startswith("#"):
        print(item.text)  # KEY

В качестве примера - если в фигме line-hight(высота строки) указана 40, то сколько это будет в пикселях

40px.

какая формула?

40 = 40px.

или все же стоит использовать
/audioList/audioList.tsx

Если не компонент:
audioList/audioList.tsx
Если компонент:
AudioList/AudioList.tsx

Какие вообще есть плюсы и минусы при использовании того или иного способа.

Когда все разработчики придерживаются единых стандартов именования, код становится более читаемым. Это упрощает процесс ревью кода и позволяет новым членам команды быстрее разобраться в проекте.

И вот можете расписать, пожалуйста, ваше мнение насчет этого. Плюсы и минусы и вашу позицию максимально подробно, хочу все же разобраться, что лучше, что хуже и что приоритетнее

Мое мнение - если есть определенный стандарт, а у Вас нет острой необходимости его нарушать, то лучше его придерживаться.

Контейнер создавался без флага --restart?
Политика перезапуска контейнера что говорит?

docker inspect -f '{{ .Name }} {{ .HostConfig.RestartPolicy.Name }}' $(docker ps -aq)

Отключение автозапуска конкретного контейнера:
docker update --restart=no <container_id>

Это "f-строки"/"форматированные строковые литералы", простой пример:

x = 5
y = 555
print(f"{x:1}")  # "5", минимальная ширина поля вывода переменной x = 1 (вывести значение x, удостоверившись, что оно занимает по меньшей мере один символ)
print(f"{x:3}")  # "  5"
print(f"{y:3}")  # "555"

# Округление Pi до десятичного значения
pi = 3.141592653589793
print(f"Pi: {pi:.1f}")  # Pi: 3.1