• Как заинтересовать человека(студента) в IT?

    sim3x
    @sim3x
    Не надо нам тут лишних людей
    Ответ написан
    Комментировать
  • Как заинтересовать человека(студента) в IT?

    Никак не заинтересовать если у него самого явного интереса к этому нет.

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

    Меня например насильно никто не тянул в мир кода, сам пришёл, своим путём.
    Ответ написан
    Комментировать
  • Как заинтересовать человека(студента) в IT?

    edli007
    @edli007
    full stack, team lead
    Сам не захочет, не начнет. Программирование это ад для обычного человека.
    Ответ написан
    Комментировать
  • Post и Get запросы, какая между ними разница и что лучше и для каких целей?

    socengel
    @socengel
    7 лет native php в продакшене, онлайн 20000+,
    Общего между ними то что они работают одинаково. Разницы между ними технически никакой. А вот идеологические различия есть.

    Я расскажу о них в контексте PHP. Прошу заметить что протокол HTTP к PHP имеет косвенное отношение потому что он создавался для обмена html страницами а PHP просто расширяет возможности и того и другого.

    GET запрос используется чтобы получить данные а POST чтобы отправить. (Напоминаю что технически они работают одинаково).

    Поэтому в контексте PHP опираясь на эту идеологию сделали следующим образом:
    1. При каждом запуске PHP по умолчанию создаются суперглобальные массивы ($_GET, $_POST).
    2. Если в строке запроса есть вопросительный знак(?). То все что после него считается параметрами GET запроса они представлены в формате 'ключ'='значение' и в качестве разделителя используется знак амперсанда (&)
    Пример:
    GET /index.php?name=Андрей&surname=Галкин
    это строка запроса, тут 2 параметра. эти параметры попадут в массив $_GET.
    3. $_POST заполняется другим способом. содержимое этого массива заполняется из "заголовков запроса". То есть из места, скрытого от глаз в явном виде. Всю рутину по созданию таких заголовков берет на себя браузер. Хотя иногда и что-то редактируется в заголовках в ручную.

    Чаще всего пост запрос используется в формах (для отправки данных).

    Например у нас есть форма для входа 2 поля логин и пароль.

    Представим что мы используем GET метод. Тогда при отправке формы мы перейдем на следующий адрес /login.php?login=Андрей&password=123 согласитесь что так передавать такую информацию совсем не безопасно. Любой может открыть ваш браузер и начиная вводить адрес сайта он из истории может увидеть ваши пароли и логины.

    А вот если бы мы указали методом POST то мы бы получили следующий запрос:
    POST /login.php (login=Андрей&password=123) то что в скобочках было бы скрыто и никак не сохранено в браузере.

    Теперь другая ситуация например форма поиска. Мы вводим текст и получаем страницу с результатами. Вот тут уместнее GET форма. потому что нам было бы удобно сразу иметь ссылку на результат поиска, то есть добавить в строку запроса можно выразится "Публичные параметры", которыми можно поделиться. И как результат в строке браузера будет конкретная ссылка на текущую страницу. Мы можем ее скопировать, и разместить где-нибудь, или например скинуть другу. И получить при переходе одну и ту же страницу. А не просить других людей зайти на сайт и в поиск вбить определенную фразу чтобы получить необходимую страницу.

    В общем подводя итог:
    GET - это чтобы получить определенную страницу в определенном виде ( сортировка, текущая страница в блоге, строка поиска и т.п. ).
    POST - для оправки данных которые не влияют на отображение страницы, в том плане что эти данные влияют только на результат выполнения скрипта ( логины, пароли, номера кредиток, сообщения и т.п. ).

    И еще одна хорошая новость их можно комбинировать, например
    POST /index.php?page=login (login=Андрей&password=123) Думаю я уже достаточно объяснил что из этого получится и какие параметры в какой массив попадут.
    Ответ написан
    2 комментария
  • Как проверить разроботчика на честность?

    Symphony
    @Symphony
    Сейчас общаюсь с разработчиком с фриланса, попросил его сбросить работы подобных сайтов как я хочу сделать.

    Это предложение не предполагает того, что он (разработчик) должен скинуть свои работы (сделанные им).
    Ответ написан
    1 комментарий
  • Как сделать круговую диаграмму на чистом CSS?

    Symphony
    @Symphony Куратор тега CSS
    Если делать как Вы хотите, т.е. выставлять произвольный процент в такую конструкцию
    <div class="circle">37%</div>
    Как вариант можно сделать с помощью svg
    Ответ написан
    6 комментариев
  • Как реализовать анимацию одного элемента по мере прокрутки страницы?

    sfi0zy
    @sfi0zy Куратор тега CSS
    Creative frontend developer
    Задача разделяется на две:
    1. Анимировать саму линию
    2. Перемещать огонь по ней

    Под первую задачу так и напрашивается SVG (статья про пунктирные вау-эффекты). Ну а решение второй вытекает из первой, достаточно загуглить "перемещение объекта по path" или еще что-то в этом духе. Получаем что-то такое (код немного странен, я другой пример перевернул вверх дном, но идея должна быть понятна):


    Остается только приделать монитор нарисовать огонь, но это уже другой вопрос.
    Ответ написан
    1 комментарий
  • Как сделать такие линии (орбиты) вокруг земли?

    rockfeeler
    @rockfeeler
    Фронтендер, дизайнер, верстальщик-перфекционист
    Все это можно. И на чистом цсс с помощью трансформаций и анимаций. По аналогии с этой парой примеров.
    Ответ написан
    2 комментария
  • Программное решение для упорядочивания жизни?

    DDDsa
    @DDDsa
    Можно вести всё это в гит-репозитории в plain-text файлах, используя простой язык разметки вроде Markdown или RST. В них есть всё, что нужно: выделение, картинки, ссылки, даже блоки кода с подсветкой синтаксиса.

    В гит-репозитории вы свободны структурировать информацию как угодно: разносить по папкам, разбивать по файлам. Это самый удобный способ вести исходники любой документации.

    Затем сверху можно прикрутить какой-нибудь статический сайт, который будет собираться из ваших исходников, или подключить пандок, чтобы собирались пдфки. Хотите заморочиться — разверните сервер где-нибудь в локальной сети и настройте с помощью CI гитлаба, гитхаба или битбакета пересборку сайта при каждом пуше в master-ветку репозитория.

    Хорошие статические генераторы сайтов из Markdown:



    Ещё есть Foliant, который из единых Markdown-исходников может собирать PDF, docx, тот же MkDocs-сайт и т д.

    Ну и так далее, тут плюс в том, что вариантов очень много и если надоест один сайт, можно взять те же ваши накопленные годами md- или rst-исходники и собрать из них что-то другое. А теперь представьте, что вас перестал устраивать EverNote, что тут делать? : )
    Ответ написан
    5 комментариев
  • Оцените пожалуйста верстку?

    Chefranov
    @Chefranov
    Новичок
    • Не хватает transition у кнопок
    • У главного меню нет ховеров
    • Блок с цифрами хорошо бы анимировать
    • Нет адаптива под устройства меньше iPhone X
    • Хорошо бы добавить плавный скролл к главному меню
    • По кнопке Free Trial и Choose plan по идее должен быть pop-up
    • В IE верстка кое-где ломается
    • Что будет если добавить еще членов команды или отзывов клиентов?
    • Есть кнопка для воспроизведения видео, но никак не работает
    • Блок с скриншотами по идее должен быть слайдером
    Ответ написан
    2 комментария
  • Как сделать, чтобы модалка появилась через 5 секунд непосредственного нахождения на странице,даже если до этого она была открыта в неактивной вкладке?

    rockon404
    @rockon404
    Frontend Developer
    Вам надо использовать window.onfocus и window.onblur.
    По onfocus заводить таймаут. По onblur чистить.
    let timeout = null;
    
    const handleClearTimeout = () => {
      clearTimeout(timeout);
    };
    
    const handleSetTimeout = () => {
      timeout = setTimeout(() => {
        showModal();
        window.removeEventListener('focus', handleSetTimeout);
        window.removeEventListener('blur', handleClearTimeout);
      }, 5000);
    };
    
    window.addEventListener('focus', handleSetTimeout);
    window.addEventListener('blur', handleClearTimeout);
    
    if (document.hasFocus()) {
      handleSetTimeout();
    }
    Ответ написан
    1 комментарий
  • Как сделать круг адаптивным, что бы сжимался в зависимости от размера экрана?

    profesor08
    @profesor08 Куратор тега CSS
    Чтоб растянуть равномерно и пропорционально по высоте относительно ширины, надо задать padding в процентах.
    padding-top: 100% - получится квадрат со стороной равной ширине контейнера.
    Подробнее тут: https://css-tricks.com/aspect-ratio-boxes/
    Ответ написан
    Комментировать
  • Как сделать записать в уже существующий файл json (я фронт)?

    KodyWiremane
    @KodyWiremane
    Пони, Debian, LEMP, LAN, любитель
    Понимаю задачу следующим образом: из JS на клиенте надо скинуть JSON в один определённый файл на "бэкенде" ^ω^

    рецепт велосипеда
    В корне React-проекта (наверное) выполняем npm i express cors body-parser

    В корне React-проекта создаём файл server.js следующего содержания:
    // импорты
    const express = require('express');
    const cors = require('cors');
    const bodyParser = require('body-parser');
    const path = require('path');
    const fs = require('fs');
    
    // пользовательские настройки:
    // на каком порту слушать по умолчанию, можно заоверрайдить через переменную окружения PORT
    const DEFAULT_PORT = 3001;
    // полный путь файла, который перезаписываем (тут, относительно файла server.js)
    const UPDATE_JSON_FILE = path.join(__dirname, 'rel/path/to/file.json');
    // URL на сервере, в которую будем кидать POST-запрос
    const UPDATE_JSON_ENDPOINT = '/api/update_json';
    
    // конфигурирование обработчиков сервера и запуск на заданном порту
    const server = express();
    
    server.use(cors());
    
    const rawParser = bodyParser.raw({type: '*/*'});
    server.post(UPDATE_JSON_ENDPOINT, rawParser, (req, res) => {
        const data = req.body instanceof Buffer ? req.body : Buffer.alloc(0);
        fs.writeFile(UPDATE_JSON_FILE, data, (err) => {
            if (!err) {
                console.log(`Wrote ${Buffer.byteLength(data)} bytes`);
                res.status(200).send('Success!');
            } else {
                console.log(err.toString());
                res.status(500).send(err.toString());
            }
        });
    });
    server.get(UPDATE_JSON_ENDPOINT, (req, res) => { res.status(400).send('POST requests only!'); });
    
    const port = process.env.PORT || DEFAULT_PORT;
    console.log(`Listening on port ${port}`);
    server.listen(port);


    Запускаем этот "бэкенд":
    node server.js

    Альтернативно, с другим портом (по крайней мере, в bash такой синтаксис)
    PORT=8080 node server.js

    В общем, порт можно задать через переменную окружения PORT. Это так, подцепил из примеров для сервера Express.

    Собственно, теперь можно отправить этому серверу JSON в POST-запросе, просто в тело засунуть. Как я понимаю, что-то вроде
    fetch('http://localhost:3001/api/update_json', {method: 'POST', body: JSON.stringify(data)})…


    Сервер возвращает 404 на неправильный путь, 400 на не-POST запрос на /api/update_json, 500 при ошибке записи в файл, ну и 200 если всё прошло успешно.

    "Сервер" пишет в консоль, на каком порту начал слушать, и число записанных байтов при каждом правильном запросе (или ошибку при ошибке записи). Выключается, соответственно, Ctrl+C в консоли.

    Также, если в package.json прописать "proxy": "http://localhost:3001"
    (с портом, соответствующим объективной реальности), то в React'е запрос можно посылать прямо на '/api/update_json', т. е. относительный запрос, без хостнейма, а Реакт догадается, что запрос внешний относительно приложения, и пойдёт к нашему серверу.

    Ну и да, никакой валидации JSON на стороне бэка нет, что в запросе — то и в файл.

    Проверил на NodeJS v10.15.2
    Ответ написан
    1 комментарий
  • Выезжающая картинка, как реализовать?

    @OMGwp
    Данынй блок просто сделан через position: fixed; Сдвинут вправо через right: -220px;
    А при ховере обнуляем right: 0; И чтобы плавно - transition: all 0.3s ease-out;
    Ответ написан
    Комментировать
  • Как на стороннем сайте ВООБЩЕ запретить переход по ссылкам и открытия новых окон в браузере? Какой код ввести в консоли?

    hzzzzl
    @hzzzzl
    адблок этим не занимается, попробуй это
    https://chrome.google.com/webstore/detail/pop-up-b...

    Иногда некоторые сайты без JS отображают заглушку (placeholder), которая мешает просматривать контент.

    ^ это Poper blocker тоже убирает
    Ответ написан
    Комментировать
  • Как сделать border-bottom?

    Vlad_IT
    @Vlad_IT Куратор тега CSS
    Front-end разработчик
    Уберите header из контейнера, а в контейнер поместите содержимое header'а
    <header class="header-menu">
          <div class="container">
            <div class="header-menu__logo"><img src="img/logo.png" alt="Логотип"></div>
            <div class="header-menu__nav-bar">
              <nav class="header-menu__nav">
                <a class="header-menu__links" href="#">ABOUT</a>
                <a class="header-menu__links" href="#">CONTACT</a>
                <a class="header-menu__links" href="#">CATALOG</a>
                <a class="header-menu__links" href="#">BLOG</a>
                <button type="button" class="header-menu__btn" name="button">Sign in</button>
              </nav>
            </header>
         </div>

    теперь у вас header на всю ширину, можете задавать ему border
    Ответ написан
    Комментировать
  • Почему сайт отображается мелко на мобильном устройстве?

    ProjectSoft
    @ProjectSoft
    Front-end && Back-end разработчик
    <meta content="width=device-width, initial-scale=1" name="viewport">
    Ответ написан
    2 комментария
  • Как сделать такую анимацию галочки?

    ProjectSoft
    @ProjectSoft
    Front-end && Back-end разработчик
    Без JS, но SVG


    JS для обратной анимации
    Ответ написан
  • Как сверстать такую штуку?

    Vlad_IT
    @Vlad_IT Куратор тега CSS
    Front-end разработчик
    Коротко, вот так
    Ответ написан
    Комментировать