Ответы пользователя по тегу Одностраничное приложение
  • Как правильно получать данные с сервера в SPA (React + Redux)?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    что делать в этом случае?

    Вам должно быть виднее. Если это данные которые могли измениться, то очевидно, что лучше подтянуть свежие. Если что-то, что меняется редко, то можно проверить наличие в хранилище.
    Еще можно использовать socket соединение и реализовать на сервере логику, чтобы он сам посылал на клиент обновления по мере их появления.
    Ответ написан
  • Какой SSR выбрать для SPA React+Redux?

    rockon404
    @rockon404
    Frontend Developer
    На самом деле руками не так долго написать, используя лишь ReactDOMServer.renderToString и опционально чего-нибудь вроде react-frontload и axios-cache-adapter.

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

    Еще как вариант посмотреть чужие решения на Github и использовать то, которое подойдет наилучшим образом.
    Ответ написан
  • Какой хостинг выбрать для приложения на реакт?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    Если это билд create-react-app, то будет. Create React App: Deployment
    Если это билд изоморфного приложения с SSR и express сервером, то нет.
    Если третий вариант, то надо больше деталей, чтобы сказать точно.

    Что-то изменится если это будет блог/интернет-магазин?

    Если нужна нормальная индексация в поисковых системах или шаринг в социальных сетях, то нужен SSR или пререндер страниц. Тут простым хостингом не обойдешься.
    Ответ написан
  • SEO для SPA на сегодняшний день?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    По средствам server side redering? Будет ли сайт норм индексироваться(при условии нормальной сео оптимизации description, title и вот это всё)?

    Будет.
    Ответ написан
  • Почему моё SPA по REST делает слишком много http-запросов?

    rockon404
    @rockon404
    Frontend Developer
    Для REST можно с запросом отдавать все связанные с сущностью или коллекцией сущностей данные:
    GET /api/posts/
    {
      posts: [ ... ],
      linked: {
        users: { ... }.
        comments: { ... },
        tags: { ... },
      }
    }

    На стороне сервера, можно складывать данные в window:
    <script>
      window.__INITIAL_STATE__ = { ... };
    </script>
    Ответ написан
  • Как правильно использовать react-router и redux в одностраничном приложении?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    game_1 store:
    {
      a: {},
      b: {},
      c: {},
    }


    game_2 store:
    {
      a: {},
      b: {},
      c: {},
    }


    shared store:
    {
      game_1: {
        a: {},
        b: {},
        c: {},
      },
      game_2: {
        a: {},
        b: {},
        c: {},
      },
    }
    Ответ написан
  • Как реализовать SPA-роутинг на react-express?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    Используйте react-router-dom. На сервере отдаете по корневому пути или по '*' html с приложением, весь роутинг будет происходить на стороне клиента.

    Руководство по react-router.
    Ответ написан
  • Онлайн-редактор для создания SPA?

    rockon404
    @rockon404
    Frontend Developer
    https://codesandbox.io онлайн редактор в котором можно написать приложение онлайн и скачать готовый проект.
    Ответ написан
  • Какой стек выбрать для не сложного многопользовательского SPA?

    rockon404
    @rockon404
    Frontend Developer
    Для вашей задачи можно использовать React/Vue + Webpack + Koa + ReactNative/Weex + MongoDB/MySQL/GraphQL + Docker + Nginx + Git.
    1. На React вы сможете написать как само веб приложение, так и нативные мобильные клиенты под Android и IOS с помощью React Native. Можно выбрать Vue - он проще для новичка и на нем также можно писать нативные мобильные приложения c Weex. Использовать Angular не советую, так как порог вхождения у него выше, а грамотную архитектуру написать сложнее. Тут нужен опыт или советы опытного разработчика.
    2. Webpack. Как не крути, а со сборкой фронтенда вам придется разобраться. В современной разработке без этого никуда. Использовать решения вроде create-react-app, лично я не советую. Как альтернативу для быстрого старта, лучше выбрать ReKit. Это тулкит для разработки на React, содержащий в себе полноценную IDE, начальную структуру проекта с роутингом и Redux, DevServer, HMR, инструменты для тестирования и много других интересных фич, вроде аналитики. Еще в сгенерированном проекте полностью отсутствует вендорная магия, вроде react-scripts в create-react-app и у вас не будет каких либо проблем с миграцией.
    3. Если выберите Koa для сервера, вам, как минимум, не придется изучать еще один ЯП. API накидать на нем плевое дело для опытного разработчика, вам же придется изучать статьи и репозитории с примерами на github. Можно выбрать Express это предшественник Koa, и в силу возраста, статей и ответов на типовые вопросы на stackoverflow для него больше.
    4. Выбор БД не принципиален.
    5. Использование Docker так же не обязательно, но разобравшись сразу, вы во многом облегчите себе жизнь и не столкнетесь с ситуацией, что ваш проект который вроде работал локально, не хочет заводиться на удаленном сервере.
    Ну Nginx и Git думаю в представлении и обосновании мотивации к использованию не нуждаются.
    Так же, возможно, хорошим решением будет использование облачных сервисов вроде Amazon Web Services

    Прежде чем браться изучать эти инструменты вам обязательно надо хорошо изучить JavaScript, HTML и CSS.

    По приложению вам понадобится:
    1. Веб сайт с описанием сервиса и формой входа/регистрации
    2. Клиентское приложение
    3. Админка
    4. Мобильные приложения

    Потратьте время на пользовательские истории, UML диаграммы и схемы интерфейсов. Используйте трекер задач.

    Мое мнение, чтобы изучить все вышеперечисленное, а начинать вам, судя по всему, придется начать с основ JavaScript, HTML и CSS, уйдет уйма времени. Чтобы после изучения всего вышеперечисленного, научиться на всем этом писать хороший код, уйдет еще больше времени. Одно дело изучить инструменты, совсем другое научиться писать хороший код, решать типовые задачи, организовывать архитектуру. А решать задачи всех планов, вам придется как по фронтенду, так и по бекенду.

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

    Если на рынке уже есть сильный конкурент и ваш сервис просто будет повторять его бизнес модель, то он вряд ли взлетит, только потратите силы и время. Обязательно изучите рынок прежде чем, что-либо предпринимать.
    Ответ написан