Настал, наконец, тот момент, когда я могу представить вам боилерплейт React Core Boilerplate (GitHub, Visual Studio Marketplace), или, иными словами, готовый шаблон проекта на ASP.NET Core.
Интересно? Добро пожаловать под кат.
Рубрика «webpack» - 5
Боилерплейт ASP.NET Core 2 с React, Redux и плюшками
2018-10-12 в 7:57, admin, рубрики: .net, asp.net core, node.js, ReactJS, redux, server-side javascript, ssr, TypeScript, webpack4 совета для оптимизации webpack-приложения
2018-10-03 в 12:24, admin, рубрики: fast-async, gsap, javascript, null-loader, webpack, webpack 4, Клиентская оптимизация, оптимизация сайта, Разработка веб-сайтовВсем привет!
За время моей работы с вебпаком у меня накопилась пара интересных советов, которые помогут вам приготовить отлично оптимизированное приложение. Приступим!
Поиск правильного способа разделения материалов сайтов с помощью Webpack
2018-09-17 в 9:00, admin, рубрики: javascript, webpack, Блог компании RUVDS.com, разработка, Разработка веб-сайтовПоиск наилучшего способа организации материалов веб-проектов может оказаться непростой задачей. Существует множество различных сценариев работы пользователей с проектами, множество технологий и других факторов, которые нужно принимать во внимание.
Автор материала, перевод которого мы сегодня публикуем, говорит, что хочет рассказать здесь обо всём, что нужно знать для грамотной подготовки материалов веб-проектов к работе. Во-первых, речь пойдёт о том, как подобрать такую стратегию разделения файлов сайта, которая наилучшим образом подойдёт для конкретного проекта и для его пользователей. Во-вторых — будут рассмотрены средства реализации выбранной стратегии.
Быстрый старт веб-проекта (BE — Java Spring, FE — React Redux, взаимодействие — Rest, WebSocket)
2018-09-11 в 14:43, admin, рубрики: BE, Bootstrap, FE, java, javascript, package.json, React, ReactJS, redux, rest, spring, webpack, WebSocket, Взаимодействие фронта и бека
Чтобы разработать современное веб приложение, необходимо иметь навыки как в создании серверной части, так и клиентской. Наиболее часто встречаемое в последнее время сочетание в корпоративной среде — это Java c использованием Spring Framework для сервера и React для клиента. Однако не все разработчики обладают Full stack навыками (знаниями как в серверной так и в клиентской части), а для начинающих разработчиков создание такой конфигурации оказывается совсем непосильной задачей.
Итак, вот готовое решение, которое позволит научиться создавать подобные конфигурации, а также экономить время при старте нового проекта.
Читать полностью »
Бег на месте и веб-разработка
2018-08-16 в 11:28, admin, рубрики: css, javascript, React, TypeScript, vanillajs, webcomponents, webpack, Здоровье гика, Разработка веб-сайтовВсем привет!
Сейчас я расскажу вам одну странную историю. Однажды, я жил в кондоминимуме, в котором, на первом этаже, был зал для фитнеса с беговыми дорожками. В юности, я активно занимался спортом и тогда мне удалось познать состояние, которое возникает во время бега и называется «второе дыхание»: это когда вдруг начинаешь чувствовать себя окрыленным божеством, не знающим усталости. Дыхание, сердцебиение и движения тела входят в какой-то особый резонанс, и превращают тебя в бегущую машину. Ощущение тем ярче, на мой взгляд, чем больше вы НЕ любили бегать до этого момента. Так вот, я каждый день ходил мимо беговых дорожек и думал, что хорошо бы вспомнить молодость. Ну и вспомнил. Беговая дорожка отлично в этом помогла, она позволяла тонко настроить темп и достичь нужного ритма. На улице у меня так не получается: бежать с ровной скоростью по городу — очень трудно, мешают рельеф и препятствия. Через какое-то время я переехал в обычную квартиру (без фитнес-зала), и стал задумываться о приобретении собственной беговой дорожки.
Читать полностью »
Открытый вебинар «Cоздание приложения на Webpack + React + Express»
2018-07-31 в 21:40, admin, рубрики: express.js, javascript, node.js, react.js, webpack, Блог компании Отус, ПрограммированиеВсем привет!
В июле 2018 года наш преподаватель курса «Разработчик JavaScript» Юрий Дворжецкий провел открытый вебинар на тему «Cоздание приложения на Webpack+React+Express», правда, в рамках второго курса, где он выступает как преподавателя одного из модулей, посвящённого JavaScript. В этом материале вы сможете ознакомиться с видеозаписью и кратким пересказом прошедшего мастер-класса.
Работа на открытом уроке проходила по следующему плану:
- Знакомство с Node JS и Express JS.
- Знакомство с Webpack.
- Знакомство с React.
Итак, поехали!
Angular: ngx-translate. Улучшаем инфраструктуру c помощью Webpack
2018-06-10 в 13:10, admin, рубрики: angular, front-end, front-end разработка, FrontEnd Development, i18n, java, loader, ngx-translate, plugin, TypeScript, webpack, Программирование, Разработка веб-сайтовДоброго времени суток.
Пришло время ngx-translate лайфхаков. Изначально я планировал 3 части, но т.к вторая часть на деле мало информативна — в этой постараюсь максимально кратко изложить 2е части.
Рассмотрим AppTranslateLoader в замену TranslateHttpLoader. Наш AppTranslateLoader будет в первую очередь обращать внимание на язык браузера и содержать fallback логику, импортировать локализации MomentJs, и производить загрузку через APP_INITIALIZER. Так же в результате объединения 2ух частей лайфхаков, по ходу мы углубимся в создание удобной и гибкой инфраструктуры локализаций в проекте.
Основной целью является не AppTranslateLoader (т.к он достаточно простой и не сделать его сложно), а создание инфраструктуры.
Я пытался писать максимально доступно, но т.к в статье достаточно много чего можно расписать подробнее — это займет много вермени и будет не интересно тем, кто уже умеет). Потому статья вышла сильно не дружелюбной к новичкам. С другой стороны в конце есть ссылка на expample продж.
Angular cli 6: зачем нужен и как использовать
2018-06-07 в 14:27, admin, рубрики: angular, Angular 6, javascript, node.js, TypeScript, webpack, Блог компании Netcracker
Всем привет!
Версия Angular 2.0.0 вышла в сентябре 2016 г. И сразу же появилось большое количество подходов к построению и сборке приложений на этом фреймворке. На просторах интернета можно найти Angular seed на любой вкус.
Мы тоже создали свой Angular seed: создали общий project-template, обязали все команды, разрабатывающие фронт-энд, использовать одну структуру приложений.
А уже через полгода, в марте 2017 года, увидела свет версия Angular cli (cli – command-line interface) 1.0.0. Идея, взятая за основу, просто отличная: систематизировать подход к разработке приложений на Angular 2+. Стандартизовать структуру приложения, создание сущностей внутри приложения, а также автоматизировать сборку приложения. Эти задачи и позволяет решить Angular cli, значительно экономя ваше время.
В статье я покажу, как перейти на Angular cli 6
Читать полностью »
Деплой webpack-приложения на github.io с помощью Travis CI
2018-05-27 в 9:58, admin, рубрики: deployment, github, github pages, github.io, javascript, node.js, React, travis-ci, webpack, деплой, Разработка веб-сайтовЗадача
Есть приложение, сгенерированное с помощью create-react-app. Нужно развернуть его на github.io.
Проблемой является то, что Github Pages работает только со статическим кодом и Jekyll.
Директивы prefetch и preload в webpack
2018-04-25 в 8:48, admin, рубрики: javascript, webpack, Блог компании RUVDS.com, разработка, Разработка веб-сайтовВ webpack 4.6.0. появилась поддержка директив prefetch и preload (они выглядят, соответственно, как «магические комментарии» webpackPrefetch и webpackPreload к командам import()). С их помощью браузеру можно давать подсказки о ресурсах, которые могут понадобиться пользователю в недалёком будущем. Браузер заблаговременно загружает такие ресурсы, что позволяет улучшить впечатление пользователя от работы с сайтом.
В материале, перевод которого мы сегодня публикуем, речь пойдёт о том, как пользоваться этими директивами для оптимизации производительности веб-сайтов.
Читать полностью »