• Как сделать анимацию для изображений?

    Ankhena
    @Ankhena Куратор тега HTML
    Нежно люблю верстку
    Очень интересно, почему текст подписи вы считаете неконтентным, а картинку не имеющую смысла наоборот, контентной?
    И с семантикой проблемы. Это ведь список, а не разрозненные div. А может ещё и ссылки на разделы портфолио.

    Итого: список, в каждом элементе либо <a> либо <span> (буду называть текстовым блоком). Картинка псевдоэлементом.
    Каждый элемент это грид в одну ячейку. (Раньше это делали абсолютами, теперь это не нужно) Внизу псевдо с картинкой, наверху текстовый блок
    В начальном положении текст прозрачный, при наведении меняется.
    Можно менять прозрачность всего блока или только фона.

    Ответ написан
    Комментировать
  • Почему не работают стили в React?

    0xD34F
    @0xD34F Куратор тега CSS
    <div className="todoListMain">
        <div className="header">

    .todoListMain.header input {

    Это какое-то невероятное позорище, оправданий которому нет. Пробел между .todoListMain и .header куда потерялся? Ну и с остальными стилями косяк тот же.
    Ответ написан
  • Экспорт большого количества переменных?

    bingo347
    @bingo347 Куратор тега JavaScript
    Crazy on performance...
    constants.js
    export const const1 = 1;
    export const const2 = 2;
    // ...
    export const const999 = 999;


    usage.js
    import * as constants from './constants';
    
    console.log(constants.const1);
    console.log(constants.const2);
    // ...
    console.log(constants.const999);
    Ответ написан
    Комментировать
  • Как построить последовательность учебных курсов для продвижения в карьере?

    sergey-gornostaev
    @sergey-gornostaev
    Седой и строгий
    Курсы полезны только их создателям. Выбирайте учебник и практику.
    Ответ написан
    7 комментариев
  • Почему Front end разработчику платят так же, а то и больше, чем Full-stack разработчику?

    sergey-gornostaev
    @sergey-gornostaev
    Седой и строгий
    Дело не во фронтеде, бэкенде или фулстэке. Просто рынок нагревается такими темпами. Меняя работы в этом году каждые три месяца, можно было получить двухкратную прибавку.
    Ответ написан
    2 комментария
  • Как использовать switch case в vue?

    bootd
    @bootd
    Гугли и ты откроешь врата знаний!
    <template>
        <i :class="getIconNameByType(type)"/>
      </template>


    setup () {
      function getIconNameByType (type) {
        const iconsMap = {
          'image/svg': 'fas file-icon fa-image',
          'image/jpeg': 'fas file-icon fa-image',
          'image/jpg': 'fas file-icon fa-image',
          'text/javascript': 'fas file-icon fa-image',
          // ....
        };
    
        return iconsMap[type];
      }
    
      return {
        getIconNameByType
      };
    }
    Ответ написан
    1 комментарий
  • Как пушить на github чтобы не вводить каждый раз логин и пароль?

    bukinion
    @bukinion
    Некороткий мануал по SSH + GitHub & BitBucket (на Win, почти тоже и на Lin)

    Вначале надо найти ключи
    $ ls -al ~/.ssh
    # Спискок файлов в директории .ssh, если они есть
    # id_rsa.pub # Нам интересны эти два брата, точнее этот публичный код (паб)
    # id_rsa # Это для сверки с пабом


    Если их нет, то будем генерить, после чего ласково попросят пароль, он должен быть сложным, в конечном итоге вводится он будет только один раз при старте сессии.
    $ ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
    # Enter file in which to save the key (/Users/you/.ssh/id_rsa): [Press enter]
    # Enter passphrase (empty for no passphrase):
    # Enter same passphrase again:


    Кстати, пароль можно и поменять:
    $ ssh-keygen -p # Введете старый, а потом новый.

    Консоль выведет следующее:
    # Your identification has been saved in /Users/you/.ssh/id_rsa.
    # Your public key has been saved in /Users/you/.ssh/id_rsa.pub.
    # The key fingerprint is:
    # 01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com


    Теперь надо добавить ваши ключи в ssh-агент
    Удостоверьтесь в том, что он у вас есть — запустите
    $ ssh-agent -s

    Должен быть следующий однострочный (!) вывод, номер pid будет другим, все остальное от лукавого:
    Agent pid 59566

    Если нет, то скорее всего в терминале другая оболочка, тогда:
    $ eval $(ssh-agent -s)
    Agent pid 59566


    Вот теперь можно добавить ключи в ssh-агент
    $ ssh-add ~/.ssh/id_rsa

    Далее, добавим ключи в VCS-сервисы github и bitbucket, для этого скопируйте содержимое id_rsa.pub, и вставьте в настройках своего аккаунта на VCS (например, "SSH and GPG keys" для Github). Активируем ключи.

    для github:
    $ ssh -T git@github.com

    чуть длинней, для bitbucket, вначале надо создать файл-конфиг, ~/.ssh/config, куда добавить следующие строки:
    Host bitbucket.org
    IdentityFile ~/.ssh/id_rsa # Тут приватный ключ!


    После чего запустить следующую команду:
    $ ssh -T git@bitbucket.org

    В каждом случае, если все пройдет успешно, то вы получите следующие сообщения:
    Hi #{username}! You've successfully authenticated, but GitHub does not provide shell access.


    или
    conq: logged in as tutorials.
    You can use git or hg to connect to Bitbucket. Shell access is disabled.


    К слову, что Github, что Bitbucket выдали мне в этот раз такое:
    Thу authenticity of host 'github.com (192.30.253.113)' can't be established.
    RSA key fingerprint is 12:12:12...12.
    Are you sure want to conecting (yes/no)?


    Ответил yes, консоль что-то ответила и все работает.

    Если же вы используете алиасы для хостов, то и активация должна быть через алиас:

    $ ssh -T git@alias


    Если работаете с Sourcetree (рекомендую для винды), то есть такой момент, что программа не принимает стандартный формат этих ключей и что бы работать с программой через ssh придется из полученного ключа (приватный) сгенерировать их в другом формате понятном putty. Для этого используется программа puttygen. Которая входит в поставку Sourcetree.


    Занудно, но уже финал близок, далее нам нужно настроить ~/.bashrc, которого на винде нет, именно он будет содержать инициализационные настройки для консоли и запускать ssh-агент, который будет включать ваши ключи, запоминать сессию:
    # Note: ~/.ssh/environment should not be used, as it
    #       already has a different purpose in SSH.
    
    env=~/.ssh/agent.env
    
    # Note: Don't bother checking SSH_AGENT_PID. It's not used
    #       by SSH itself, and it might even be incorrect
    #       (for example, when using agent-forwarding over SSH).
    
    agent_is_running() {
        if [ "$SSH_AUTH_SOCK" ]; then
            # ssh-add returns:
            #   0 = agent running, has keys
            #   1 = agent running, no keys
            #   2 = agent not running
            ssh-add -l >/dev/null 2>&1 || [ $? -eq 1 ]
        else
            false
        fi
    }
    
    agent_has_keys() {
        ssh-add -l >/dev/null 2>&1
    }
    
    agent_load_env() {
        . "$env" >/dev/null
    }
    
    agent_start() {
        (umask 077; ssh-agent >"$env")
        . "$env" >/dev/null
    }
    
    if ! agent_is_running; then
        agent_load_env
    fi
    
    # if your keys are not stored in ~/.ssh/id_rsa or ~/.ssh/id_dsa, you'll need
    # to paste the proper path after ssh-add
    if ! agent_is_running; then
        agent_start
        ssh-add
    elif ! agent_has_keys; then
        ssh-add
    fi
    
    unset env


    И снова не финал, скорее всего так как вы не пользовались SSH, то ваши уже существующие локальные репо будут работать по http/https, поэтому надо сменить адреса. Адреса удаленных репозиториев проверяются командой $ git remote -v. Для смены адресов git есть специальная команда: $ set-url, ввести следующее:
    $ git remote set-url origin git@github.com:USERNAME/OTHERREPOSITORY.git


    Вернуть все на Родину можно аналогично
    Ответ написан
    1 комментарий
  • Насколько хорошо сайт на Nuxt + SSR индексируется в Яндексе?

    delphinpro
    @delphinpro
    frontend developer
    При использовании ssr разметка генерируется на стороне сервера => индексируется как обычный сайт.
    В общем-то ради индексации и был придуман серверный рендер
    Ответ написан
    5 комментариев
  • Норма ли перегрев MacBook Pro 2020г?

    DevMan
    @DevMan
    шумит и греется – это ни о чем. и для ноутов – это нормально.
    конкретней можно говорить только при предоставлении конкретных цифр и описании при каких условиях они получены.
    Ответ написан
    2 комментария
  • Как работает веб-сервер и node js в связке? Зачем нужен Nginx?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега Веб-разработка
    Самое простое - nginx отдаёт статику. На больших объёмах делать это через Ноду неэффективно.
    Посложнее - nginx позволяет управлять ходом запроса. Например, редиректить на https.
    Ещё сложнее - можно настроить nginx, чтобы он умно балансировал запросы между несколькими бэкендами и автоматом блокировал слишком частые попытки подключения.

    Nginx очень хорошо в промышленных масштабах делает определённую часть работы, связанной с http-запросом, поэтому ему эту часть работы и делегируют.
    Ответ написан
    Комментировать
  • Что такое Vue Native?

    andykov
    @andykov
    Shit happens
    Vue Native это обертка над React Native.
    NativeScript это отдельный кроссплатформенный фреймворк который дает доступ к нативным компонентам платформы. И оба эти инструмента это не WebView.
    NS использует движок V8 JavaScript для Android и JavaScriptCore для iOS. RN использует только JavaScriptCore
    для обеих платформ. NS может в JS, TS, Angular и в этом году добавили официальную поддержку Vue за счет интеграции с плагином nativescript-vue
    Можно в playground'e пощупать.

    С RN я не работал, как и с VN, но мне интересно развитие NS.
    В общих чертах RN и NS похожи, но отличаются архитектурой взаимодействия с родными модулями платформ.
    NS работает c API интерфейсом платформы непосредственно в движке JS, отправляя вызовы и конвертируя данные на лету. При компиляции все XML компоненты передаются на собственные компоненты Android и iOS перед упаковкой в ​​двоичный файл платформы. В оф.документации все расписано
    Есть хорошая статья в блоге NS, где они разбирают серию статей от Airbnb об опыте с RN.

    Считаю что NativeScript недооценен сообществом, годный продукт.

    Простые приложения можно строить и на NS, что то более сложное где память решает, лучше писать нативно.
    Ответ написан
    1 комментарий
  • Как правильно отрисовывать списки по 3 во vue js?

    dima9595
    @dima9595
    Junior PHP
    уберите тег Vue, так как ваша проблема не является проблемой по VueJS.
    Прочтите про flex'ы, grid'ы. Должно помочь.
    Ответ написан
    8 комментариев
  • Стоит ли учить html, css,js в 2021?

    approximate_solution
    @approximate_solution
    JS Developer. Angular\React\Vue\Ember
    Просто актуальной инфы так мало по этому, а я вылез из 2015 года.

    У вас странные вопросы. HTML + CSS + JS это костяк всего веба который в принципе не заменим.

    Логически построим цепочку. Есть бизнес разного уровня - ИП, средний бизнес, интерпрайз.

    Wordpress Elementor и его аналоги, подходят для конкретной задачи - быстрое прототипирование интерфейса и запуск бизнеса в кратчайшие сроки. Пример: сегодня 1 марта, и до 8 марта вам нужно быстро запустить лендинг или магазин на шаблоне wp, что бы реализовать продажу цветов. Всё.

    Если же ваш бизнес уровня средний и выше среднего, вы не сможете насколько хорошо оптимизировать, масштабировать свой проект, что бы он покрывал все запросы. В этом случае на помощь уже приходят специалисты уровня "фронтендер + бэкэндер + тимлид + PM" и каждый решают свою задачу.

    Задача фронтендера - отлично знать HTML + CSS + JS + (React\Vue\Angular) + REST API + WebSocket + сборщики + препроцессоры + figma + performance + assesability - и да, всё это требования джуна.

    Умение грамотно строить скелет приложения не накинув лишних вложенностей + грамотно проектируя интерфейс компонентами - добавляет вам денег и профита в конце пути. Джуна без знаний html\css в принципе на работу не возьмут.
    Ответ написан
    1 комментарий
  • Почему не выходит получить данные запроса GET в request, в консоли пустая переменная?

    KickeRocK
    @KickeRocK
    FrontFinish
    const request = require('request');
    
    var cards;

    бе
    По теме, это асинхронная операция, у вас значение выводится до её выполнения, даже если оно занимает крайне мало времени, выведите после(по нажатию на кнопку или в callback'e функции запроса)
    Ответ написан
    Комментировать
  • Как изучить язык баз данных SQL?

    @poimanoo
    Я перед собеседованием на должность sql-джуна будучи полным нулем за ночь порешал задачки на этом сайте и на следующий день решил все предложенные задачи и был принят) Скажу так - я бы посоветовал порешать эти задачи, они там предлагаются по нарастанию сложности и подкреплены теорией, за которой вам не нужно лишний раз лезть в учебники. Уверяю, с каждым десятком решенных задач Вы будете чувствовать себя гуру sql) Спустя задачек 30, когда у Вас сформируется представление о том, что из себя представляет SQL на деле, тогда можно приступать к литературе, поверьте, после практики гораздо легче воспринимать материал, ибо уже имеется представление, о чем речь.
    По литературе(с небольшими пояснениями):

    1. Введение в системы баз данных(Автор C.J.Date) - на мой взгляд очень доступное и максимально компактное описание того, на чем базируется SQL, разжеваны основные понятия, рассмотрены нормальные формы, а после предлагаются задачки.

    2. SQL Полное руководство - тут понятно по названию, здесь можно найти описание всех возможностей. Ищите наиболее позднее издание(у меня третье, для примера, это 2015 год).

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

    Если вы выбрали MS SQL Server:

    1. Microsoft SQL Server 2012 Руководство для начинающих - там хоть и не сильно углубляясь, но описано почти все что нужно на начальных этапах. Там и про индексы, и про оптимизацию, и про бизнес-аналитику, в общем, рекомендую.

    2. Microsoft SQL Server 2012 Создание запросов - просто и исчерпывающе(на момент издания) о том, как можно и нужно писать запросы на t-sql(расширение sql для MS SQL Server) с закреплением материала предлагаемыми заданиями.

    Если Вы выбрали Postgresql, то официальное руководство там исчерпывающее.

    По Oracle и MySQL советов дать не могу, ибо дела не имел. Удачи!
    Ответ написан
    1 комментарий
  • Как заменить for на reduce?

    0xD34F
    @0xD34F Куратор тега JavaScript
    const { x: countX = 0, o: countO = 0 } = Array
      .from(str.toLowerCase())
      .reduce((acc, n) => (acc[n] = (acc[n] ?? 0) + 1, acc), {});
    Ответ написан
    5 комментариев
  • С чего начать разработку фулстек сайта?

    Stalker_RED
    @Stalker_RED
    Ну например:

    С постановки бизнес-задачи, анализа конкурентов, составления списка минимальных требований и фич.
    Затем выбор фреймворка и/или продумывание архитектуры.
    Затем создаете главную страничку с hello world, и постепенно начинаете реализовывать базовую бизнес-логику, затем добавляете фичи.

    Это не единственный путь, можно менять порядок действий.
    На практике встречается всякое, вплоть до абсурда, когда сперва пишется какой-то код, а потом придумывается "что этим всем хотел сказать автор", и придумывается архитектура.
    Ответ написан
    1 комментарий
  • Почему в JS движках только один call stack?

    vabka
    @vabka
    Токсичный шарпист
    В JavaScript есть только один стек вызовов, так как это однопоточный язык.

    Немного кривая формулировка конечно) Просто раньше JS был только в браузерах, и был однопоточным, тк использовался в основном для всякого интерактива - нужно было активно работать с DOM.
    1. К DOM нельзя обращаться одновременно из нескольких потоков
    2. Не было задач для многопоточности на фронтенде

    Сейчас же для многопоточности есть Web worker, да и та же нода, например, многопоточная.
    Ответ написан
    4 комментария
  • Как происходит приведение типов при нестрогом равенстве?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    Непустые строки в логических операциях (вы используете логическое отрицание) приводятся к true.
    (!!"false" == !!"true") → (!!true == !!true) → (!false == !false) → (true == true) → true
    P.S. Строгость равенства в данном случае вообще не при чём, у вас оба значения при сравнении имеют один тип, boolean.
    Ответ написан
    Комментировать