Pros and Cons of Vue.js Development Services
https://dev.to/steven_d_gital/pros-and-cons-of-vuejs-development-services-14hi
For IT organizations, it is crucial to use innovative technologies for their clients to drive revenue. Several times people are discussing the benefits of using the Vue.js programming language instead of any other and will get the conclusion that working with experienced Vue.js developer is always a better idea.
In the article, we will discuss Vue.js, the strengths and weaknesses of experts of Vue.js, and features and functions Vue.js offers for high-quality application development. Stay tuned!
What is Vue.js development?
Vue.js is developed by Evan You and It is a JavaScript-based framework first released in 2014. It is a framework to develop single-page applications. But within time, the range of Vue.js development expanded significantly.
Vue.js framework is very flexible. Vue.js can perform equally well in any kind of app development and web development.
Pros of Vue.js development
Vue.js framework offer infinite advantages compare to others. We will have a look at those advantages in this article.
Lightweight
Lightweight is one of the important pros of Vue.js that developer is looking for while developing. Vue.js is very convenient for developers to use for any kind of complex project.
Due to the lightweight of Vue.js, Installation and loading will be faster and it is good from the perspective of SEO and UX. Vue.js developers need to spend less time on optimization.
User-friendly
Many experts have to say that Vue does not need a steep learning curve, which is more easier and beneficial for fresher. With the not on the learning curve, Vue.js only needs the knowledge of HTML, JavaScript, and CSS. Vue.js offers the browser plugin under Chrome and Firefox, which make things easier for developers.
Reusable
Vue.js can be reusable for developers who have enough experience and tech-savvy. Vue.js helps programmers to write their own code so they can use it for various functions if needed.
Ease of use
One of the main reasons behind the success of Vue.js is it is easy to use with minimal effort. Vue.js has all the necessary codes in one file. With such easy use and flexibility, developers can develop any kind of structure for applications.
Integration
Vue.js uses syntax and virtual DOM like Angular in the same way. According to Evan You, Angular offers data-managed DOM and data binding, It is just amazing.
Vue.js developers don’t have to match with DOM on their own. This makes the Vue.js development easier.
Compatibility
To facilitate integration with existing applications, Vue.js used HTML to render objects. Vue.js is more flexible compared to other frameworks as it allows developers to write their own discretion with JSX, HTML, or JS. Based on the structure, Vue.js is similar to React and Angular. So you can easily switch from Angular or React to Vue.js.
Customization
Vue.js offer developers the easy access of all the features and functions. Each part of framework performs its function, So you can quickly adapt and implement the changes if needed.
Cons of Vue.js development
We all know that every framework has some cons, no framework could be perfect. And Same goes with Vue.js framework.
Lack of plugins;
Limitations in making use of the community;
Difficulties with mobile support;
Lack of scalability;
Difficulties with two-way binding;
Lack of highly experienced experts;
Excessive code flexibility.
Bottom line
If you have a wish to develop functional SPA or UI, pros of Vue.js always comes in first. Whether you want to develop the small project or large small, Vue.js will be always a perfect choice for development work.
If you want to inquire about Vue.js development services, Contact the best Vue.js development company and Hire Vue.js developer. Experience and talented Vue.js developers will help you to achieve your goals and profitable projects.
https://dev.to/steven_d_gital/pros-and-cons-of-vuejs-development-services-14hi
For IT organizations, it is crucial to use innovative technologies for their clients to drive revenue. Several times people are discussing the benefits of using the Vue.js programming language instead of any other and will get the conclusion that working with experienced Vue.js developer is always a better idea.
In the article, we will discuss Vue.js, the strengths and weaknesses of experts of Vue.js, and features and functions Vue.js offers for high-quality application development. Stay tuned!
What is Vue.js development?
Vue.js is developed by Evan You and It is a JavaScript-based framework first released in 2014. It is a framework to develop single-page applications. But within time, the range of Vue.js development expanded significantly.
Vue.js framework is very flexible. Vue.js can perform equally well in any kind of app development and web development.
Pros of Vue.js development
Vue.js framework offer infinite advantages compare to others. We will have a look at those advantages in this article.
Lightweight
Lightweight is one of the important pros of Vue.js that developer is looking for while developing. Vue.js is very convenient for developers to use for any kind of complex project.
Due to the lightweight of Vue.js, Installation and loading will be faster and it is good from the perspective of SEO and UX. Vue.js developers need to spend less time on optimization.
User-friendly
Many experts have to say that Vue does not need a steep learning curve, which is more easier and beneficial for fresher. With the not on the learning curve, Vue.js only needs the knowledge of HTML, JavaScript, and CSS. Vue.js offers the browser plugin under Chrome and Firefox, which make things easier for developers.
Reusable
Vue.js can be reusable for developers who have enough experience and tech-savvy. Vue.js helps programmers to write their own code so they can use it for various functions if needed.
Ease of use
One of the main reasons behind the success of Vue.js is it is easy to use with minimal effort. Vue.js has all the necessary codes in one file. With such easy use and flexibility, developers can develop any kind of structure for applications.
Integration
Vue.js uses syntax and virtual DOM like Angular in the same way. According to Evan You, Angular offers data-managed DOM and data binding, It is just amazing.
Vue.js developers don’t have to match with DOM on their own. This makes the Vue.js development easier.
Compatibility
To facilitate integration with existing applications, Vue.js used HTML to render objects. Vue.js is more flexible compared to other frameworks as it allows developers to write their own discretion with JSX, HTML, or JS. Based on the structure, Vue.js is similar to React and Angular. So you can easily switch from Angular or React to Vue.js.
Customization
Vue.js offer developers the easy access of all the features and functions. Each part of framework performs its function, So you can quickly adapt and implement the changes if needed.
Cons of Vue.js development
We all know that every framework has some cons, no framework could be perfect. And Same goes with Vue.js framework.
Lack of plugins;
Limitations in making use of the community;
Difficulties with mobile support;
Lack of scalability;
Difficulties with two-way binding;
Lack of highly experienced experts;
Excessive code flexibility.
Bottom line
If you have a wish to develop functional SPA or UI, pros of Vue.js always comes in first. Whether you want to develop the small project or large small, Vue.js will be always a perfect choice for development work.
If you want to inquire about Vue.js development services, Contact the best Vue.js development company and Hire Vue.js developer. Experience and talented Vue.js developers will help you to achieve your goals and profitable projects.
DEV Community
Pros and Cons of Vue.js Development Services
For IT organizations, it is crucial to use innovative technologies for their clients to drive...
Looking at the new v-memo directive in Vue 3.2
https://dev.to/reegodev/looking-at-the-new-v-memo-directive-in-vue-32-5d6d
The release of Vue 3.2 introduced some new functionalities, mainly related to performance and optimisations. One of these features is a new directive called v-memo
What is v-memo?
v-memo, as the name suggests, is a new directive related to the memoization of parts of a template.
If you are not familiar with the term "memoization", wikipedia describes it as:
In computing, memoization or memoisation is an optimization technique used primarily to speed up computer programs by storing the results of expensive function calls and returning the cached result when the same inputs occur again
In Vue this description sounds really like what computed properties already do.
In fact v-memo can be seen as a computed property for parts of a template!
Using v-memo
v-memo accepts a single parameter, which should be an array of dependencies. The element that uses this directive and all its descendants will only be re-rendered when one of the dependencies change.
For example:
<div v-memo="[dep1, dep2]">
...
</div>
Note that if you don't provide dependencies , ie:v-memo="[]", you obtain the same functionality as v-once.
Examples
Since v-memo is mainly useful for performance reasons, one of the best scenarios where you'd want to use it is when rendering huge lists of items with v-for:
<div v-for="item in list" :key="item.id" v-memo="[item.id === selected]">
<p>ID: {{ item.id }} - selected: {{ item.id === selected }}</p>
</div>
In this example we are telling v-memo to only re-render an item if it has been selected or deselected, all other items will be skipped entirely.
We don't need to include item.id in the dependency array since the sub-template of every item is already keyed, so it generates a separate sub-tree.
Another thing to keep in mind is that v-memo is only useful in a v-for if you are using some kind of interpolation. If for example you are rendering a list of components like <MyComponent v-for="item in list" :key="item.id" v-memo />, you are not going to benefit from v-memo as the diffing is made inside each component.
I've prepared an example on StackBlitz that shows visually how v-memo helps with performance in lists: https://stackblitz.com/edit/vue-v-memo
https://dev.to/reegodev/looking-at-the-new-v-memo-directive-in-vue-32-5d6d
The release of Vue 3.2 introduced some new functionalities, mainly related to performance and optimisations. One of these features is a new directive called v-memo
What is v-memo?
v-memo, as the name suggests, is a new directive related to the memoization of parts of a template.
If you are not familiar with the term "memoization", wikipedia describes it as:
In computing, memoization or memoisation is an optimization technique used primarily to speed up computer programs by storing the results of expensive function calls and returning the cached result when the same inputs occur again
In Vue this description sounds really like what computed properties already do.
In fact v-memo can be seen as a computed property for parts of a template!
Using v-memo
v-memo accepts a single parameter, which should be an array of dependencies. The element that uses this directive and all its descendants will only be re-rendered when one of the dependencies change.
For example:
<div v-memo="[dep1, dep2]">
...
</div>
Note that if you don't provide dependencies , ie:v-memo="[]", you obtain the same functionality as v-once.
Examples
Since v-memo is mainly useful for performance reasons, one of the best scenarios where you'd want to use it is when rendering huge lists of items with v-for:
<div v-for="item in list" :key="item.id" v-memo="[item.id === selected]">
<p>ID: {{ item.id }} - selected: {{ item.id === selected }}</p>
</div>
In this example we are telling v-memo to only re-render an item if it has been selected or deselected, all other items will be skipped entirely.
We don't need to include item.id in the dependency array since the sub-template of every item is already keyed, so it generates a separate sub-tree.
Another thing to keep in mind is that v-memo is only useful in a v-for if you are using some kind of interpolation. If for example you are rendering a list of components like <MyComponent v-for="item in list" :key="item.id" v-memo />, you are not going to benefit from v-memo as the diffing is made inside each component.
I've prepared an example on StackBlitz that shows visually how v-memo helps with performance in lists: https://stackblitz.com/edit/vue-v-memo
DEV Community
Looking at the new v-memo directive in Vue 3.2
The release of Vue 3.2 introduced some new functionalities, mainly related to performance and...
TIL about specific Array combination types
https://dev.to/vanquard/til-about-specific-array-combination-types-28bo
Okay, so its not actually called "specific Array combination types", but that was the best description I had for it, before I looked it up.
Its actually called "Tuple Types" and the documentation can be found here: https://www.tutorialsteacher.com/typescript/typescript-tuple
I'll come back to why this blew my mind today, but first, lets scroll back a bit, to some of my first steps into JS/TS programming. I started my programming career in Java, and one of the things that annoyed the hell out of me, was the fact that I could only have 1 object returned from a function (This was before the Pair class was introduced).
But in JS we can easily just return an array with 2 values:
const someFunction = () => {
return ['Mathias', 28];
}
And combined with some destructuring on the recieving, it was all nice and easy:
const [myName, myAge] = someFunction();
Adding types
Until today I never had to add types onto a scenario like this, usually when I work with arrays, I either just do a basic string[], or when its required in complex object scenarios: Array<{name: string, age: number}>.
But with the tuples we can actually avoid naming them and just say the return type for our function is [string, number]:
const someFunction = (): [string, number] => {
return ['Mathias', 28];
}
Vue relation
I came across this when I working with Vue2 combined with TS, and was trying to create a v-for loop over a Map, but Vue2 did not support this, so I had to come up with a different approach that supported the same end goal.
So this is where the new tuples came in handy! Given an example with some data in a Map:
const map = new Map<string, object>();
map.set('key1', {data: 'lots of data'});
map.set('key2', {data: 'more data'});
I could then destructure it into an array like so:
const asArray = ...map.entries();
// Yielding:
[
['key1', {data: 'lots of data'}],
['key2', {data: 'more data'}],
]
And in order to Type this we now have:
const asArray: Array<[string, object]> = ...map.entries();
Thank you for reading this far, hope you gained something from this post.
https://dev.to/vanquard/til-about-specific-array-combination-types-28bo
Okay, so its not actually called "specific Array combination types", but that was the best description I had for it, before I looked it up.
Its actually called "Tuple Types" and the documentation can be found here: https://www.tutorialsteacher.com/typescript/typescript-tuple
I'll come back to why this blew my mind today, but first, lets scroll back a bit, to some of my first steps into JS/TS programming. I started my programming career in Java, and one of the things that annoyed the hell out of me, was the fact that I could only have 1 object returned from a function (This was before the Pair class was introduced).
But in JS we can easily just return an array with 2 values:
const someFunction = () => {
return ['Mathias', 28];
}
And combined with some destructuring on the recieving, it was all nice and easy:
const [myName, myAge] = someFunction();
Adding types
Until today I never had to add types onto a scenario like this, usually when I work with arrays, I either just do a basic string[], or when its required in complex object scenarios: Array<{name: string, age: number}>.
But with the tuples we can actually avoid naming them and just say the return type for our function is [string, number]:
const someFunction = (): [string, number] => {
return ['Mathias', 28];
}
Vue relation
I came across this when I working with Vue2 combined with TS, and was trying to create a v-for loop over a Map, but Vue2 did not support this, so I had to come up with a different approach that supported the same end goal.
So this is where the new tuples came in handy! Given an example with some data in a Map:
const map = new Map<string, object>();
map.set('key1', {data: 'lots of data'});
map.set('key2', {data: 'more data'});
I could then destructure it into an array like so:
const asArray = ...map.entries();
// Yielding:
[
['key1', {data: 'lots of data'}],
['key2', {data: 'more data'}],
]
And in order to Type this we now have:
const asArray: Array<[string, object]> = ...map.entries();
Thank you for reading this far, hope you gained something from this post.
DEV Community
TIL about specific Array combination types
Okay, so its not actually called "specific Array combination types", but that was the best...
NuxtJS v.2.15.8. How to hide private keys?
https://dev.to/vadiminsk/nuxtjs-v2158-how-to-hide-private-keys-3h62
Hello everyone! Currently I am working on PWA project. We build pwa with nuxt and drupal as backend. So I have a lot of secrets from backend and don`t know where store it.
Can you share your best practices?
https://dev.to/vadiminsk/nuxtjs-v2158-how-to-hide-private-keys-3h62
Hello everyone! Currently I am working on PWA project. We build pwa with nuxt and drupal as backend. So I have a lot of secrets from backend and don`t know where store it.
Can you share your best practices?
DEV Community
NuxtJS v.2.15.8. How to hide private keys?
Hello everyone! Currently I am working on PWA project. We build pwa with nuxt and drupal as backend....
Simple Black Friday
https://dev.to/core_ui/simple-black-friday-1eep
Not long ago, a guy, let’s name him “Kyle” asked us about CoreUI’s Tips for developers to create stunning web or app.
Answer was easy: “keep it simple” :)
“Everything should be made as simple as possible, but no simpler.”
Albert Einstein
You probably know Steve Krug’s “Don’t let me think” — it also a “bible” for CoreUI’s team. When you keep your design simple, then you’ll easily understand the principles of intuitive navigation and information design.
There’re too many overloaded products available on the market, that’s why we’ve always wanted to keep CoreUI as simple as it’s possible.
So we decided to master a CoreUI as one, comprehensive ecosystem or rather tool for the most significant UI needs.
When designing a stunning web or an app, it’s good to stick to valuable tools which will make your work easier. As an example, we can have “CoreUI’s Triada”:
Admin Templates
UI Components
Icons
They are all available for the most popular frameworks like Angular, Vue, Bootstrap and React. Such universal tools let the designer to be more flexible when working on different projects.
Keep it simple and responsive — the rest will follow.
PS Black Friday obliges… If you’re ready for -70% bounce here: Simple CoreUI Black Friday
https://dev.to/core_ui/simple-black-friday-1eep
Not long ago, a guy, let’s name him “Kyle” asked us about CoreUI’s Tips for developers to create stunning web or app.
Answer was easy: “keep it simple” :)
“Everything should be made as simple as possible, but no simpler.”
Albert Einstein
You probably know Steve Krug’s “Don’t let me think” — it also a “bible” for CoreUI’s team. When you keep your design simple, then you’ll easily understand the principles of intuitive navigation and information design.
There’re too many overloaded products available on the market, that’s why we’ve always wanted to keep CoreUI as simple as it’s possible.
So we decided to master a CoreUI as one, comprehensive ecosystem or rather tool for the most significant UI needs.
When designing a stunning web or an app, it’s good to stick to valuable tools which will make your work easier. As an example, we can have “CoreUI’s Triada”:
Admin Templates
UI Components
Icons
They are all available for the most popular frameworks like Angular, Vue, Bootstrap and React. Such universal tools let the designer to be more flexible when working on different projects.
Keep it simple and responsive — the rest will follow.
PS Black Friday obliges… If you’re ready for -70% bounce here: Simple CoreUI Black Friday
DEV Community
Simple Black Friday
Not long ago, a guy, let’s name him “Kyle” asked us about CoreUI’s Tips for developers to create...
A Vue wrapper for HubSpot Forms
https://vuejsexamples.com/a-vue-wrapper-for-hubspot-forms/
A Vue wrapper for HubSpot Forms
https://vuejsexamples.com/a-vue-wrapper-for-hubspot-forms/
A Vue wrapper for HubSpot Forms
Webpack/Rollup/Vite plugin to add multiple root-node support to Vue 2 SFCs
https://vuejsexamples.com/webpack-rollup-vite-plugin-to-add-multiple-root-node-support-to-vue-2-sfcs/
Webpack/Rollup/Vite plugin to add multiple root-node support to Vue 2 SFCs
https://vuejsexamples.com/webpack-rollup-vite-plugin-to-add-multiple-root-node-support-to-vue-2-sfcs/
Webpack/Rollup/Vite plugin to add multiple root-node support to Vue 2 SFCs
Petite-vue: 6kb subset of Vue optimized for progressive enhancement
https://vuejsexamples.com/petite-vue-6kb-subset-of-vue-optimized-for-progressive-enhancement/
Petite-vue: 6kb subset of Vue optimized for progressive enhancement
https://vuejsexamples.com/petite-vue-6kb-subset-of-vue-optimized-for-progressive-enhancement/
Petite-vue: 6kb subset of Vue optimized for progressive enhancement
Museum of Ordinary Objects Web Application using Vue
https://vuejsexamples.com/museum-of-ordinary-objects-web-application-using-vue/
Museum of Ordinary Objects Web Application using Vue
https://vuejsexamples.com/museum-of-ordinary-objects-web-application-using-vue/
Museum of Ordinary Objects Web Application using Vue
Import types in Vue SFC for defineProps
https://vuejsexamples.com/import-types-in-vue-sfc-for-defineprops/
Import types in Vue SFC for defineProps
https://vuejsexamples.com/import-types-in-vue-sfc-for-defineprops/
Import types in Vue SFC for defineProps
Как локализовать Vue.js приложение
https://habr.com/ru/post/573894/?utm_campaign=573894&utm_source=habrahabr&utm_medium=rss
Как локализовать Vue.js приложениеОднажды мне понадобилось перевести готовый Vue сайт на несколько языков. Немного погуглив я нашел несколько полу рабочих вариантов как это сделать и решил показать свой рабочий вариант. Подробнее
https://habr.com/ru/post/573894/?utm_campaign=573894&utm_source=habrahabr&utm_medium=rss
Как локализовать Vue.js приложениеОднажды мне понадобилось перевести готовый Vue сайт на несколько языков. Немного погуглив я нашел несколько полу рабочих вариантов как это сделать и решил показать свой рабочий вариант. Подробнее
Хабр
Как локализовать Vue.js приложение
ИнструментыVue.js вместе с Vue CLI.vue-i18nVSCodeBabelEditVue.js вместе с Vue CLIДля тех кто не знает как работать с Vue CLI вот документация. Если кратко, то для установки нам нужно ввести две...
Что такое v9s, и почему потребовалось писать еще одну библиотеку валидации?
https://habr.com/ru/post/574044/?utm_campaign=574044&utm_source=habrahabr&utm_medium=rss
Примерно год назад фронтенд нашего проекта, в качестве фреймворка для которого используется Vue.js 2, дошел до состояния, хорошо описываемого словами "проще сжечь".К тому времени наш нетипизированный корабль уже трещал по всем швам, и решено было убить сразу нескольких зайцев одним выстрелом: полностью перевести проект на TypeScript, внедрить Vue Composition API и решить проблемы валидации сложных форм.А проблемы были. Vuelidate - отличная библиотека с массой готовых валидаторов и остается таковой до тех пор, пока мы имеем дело с, так сказать, плоскими формами - формами, не использующими вложенных компонентов, также требующих валидации. Vuelidate работает на уровне компонента, требует наличия миксина, содержит массу правил, которые нам не были нужны, но все равно тянулись в составе пакета, поддержка TypeScript и Composition API на тот момент отсутствовала, и мы не могли более с этим миритьcя. Читать далее
https://habr.com/ru/post/574044/?utm_campaign=574044&utm_source=habrahabr&utm_medium=rss
Примерно год назад фронтенд нашего проекта, в качестве фреймворка для которого используется Vue.js 2, дошел до состояния, хорошо описываемого словами "проще сжечь".К тому времени наш нетипизированный корабль уже трещал по всем швам, и решено было убить сразу нескольких зайцев одним выстрелом: полностью перевести проект на TypeScript, внедрить Vue Composition API и решить проблемы валидации сложных форм.А проблемы были. Vuelidate - отличная библиотека с массой готовых валидаторов и остается таковой до тех пор, пока мы имеем дело с, так сказать, плоскими формами - формами, не использующими вложенных компонентов, также требующих валидации. Vuelidate работает на уровне компонента, требует наличия миксина, содержит массу правил, которые нам не были нужны, но все равно тянулись в составе пакета, поддержка TypeScript и Composition API на тот момент отсутствовала, и мы не могли более с этим миритьcя. Читать далее
Хабр
Что такое v9s, и почему потребовалось писать еще одну библиотеку валидации?
Предупреждение Хотелось бы сразу предупредить о том, что все изложенное ниже, скорее, рассуждения на тему современных реалий мира JavaScript, нежели описание конкретного решения. Предыстория Примерно...
Сервис просмотра и редактирования библиотек геометок
https://habr.com/ru/post/574716/?utm_campaign=574716&utm_source=habrahabr&utm_medium=rss
В 2018 решил освоить Vue.js, так, для общего развития, а как известно, лучший способ освоить язык/фреймворк/etc — начать писать. В голову пришла довольно простая идея, которая со временем выросла в довольно большой проект — онлайн сервис «Места», позволяющий создавать свои коллекции мест на карте, геометок, с подробной информацией о них. Собирать их в альбомы, сортировать в дереве папок, просматривать, редактировать, обмениваться с другими, открывать для просмотра другим пользователям сервиса. Привязывать к местам фотоальбомы, экспортировать свои библиотеки в файлы JSON и GPX (для навигаторов, например), импортировать в свои библиотеки места других людей.Идея была проста. Есть множество средств создания фотоальбомов, музыкальных плейлистов — с описаниями, возможностью сортировки, ссылками, преферансом и барышнями. А похожей полноценной картографической реализации толком нет. По крайней мере, я не нашёл.Представьте, что вы пошли с другом в поход. Каждый у себя в навигаторе смартфона отмечал какие-то интересные места — удобные стоянки, опасные пороги, прохождение которых описывал. Потом вернулись домой, и каждый остался при своих. Сервис позволяет собрать их вместе, слив оба набора в один, отсортировать, разложить по папкам, отредактировать описания в удобном интерфейсе на компе, добавить фотографии, ссылки, сделать при желании видимыми другим пользователям сервиса, экспортировать потом, в конце концов, для использования в навигаторах и т. д.Проект свободный (https://github.com/assador/places, сам действующий сервис пока здесь: https://places.scrofa-tridens.ru). Сейчас в планах помимо API Яндекс.Карт, которые отвечают, собственно, за карту, подключить и другие — OSM, 2ГИС и пр. Хочу добавить возможность добавлять к местам не только фото-, но и видео-, и аудиоальбомы. Развивать структуру прав и ролей пользователей, их связь друг с другом на сервисе, расшаривать библиотеки в соцсети и пр. Короче, для меня штука интересная. Читать далее
https://habr.com/ru/post/574716/?utm_campaign=574716&utm_source=habrahabr&utm_medium=rss
В 2018 решил освоить Vue.js, так, для общего развития, а как известно, лучший способ освоить язык/фреймворк/etc — начать писать. В голову пришла довольно простая идея, которая со временем выросла в довольно большой проект — онлайн сервис «Места», позволяющий создавать свои коллекции мест на карте, геометок, с подробной информацией о них. Собирать их в альбомы, сортировать в дереве папок, просматривать, редактировать, обмениваться с другими, открывать для просмотра другим пользователям сервиса. Привязывать к местам фотоальбомы, экспортировать свои библиотеки в файлы JSON и GPX (для навигаторов, например), импортировать в свои библиотеки места других людей.Идея была проста. Есть множество средств создания фотоальбомов, музыкальных плейлистов — с описаниями, возможностью сортировки, ссылками, преферансом и барышнями. А похожей полноценной картографической реализации толком нет. По крайней мере, я не нашёл.Представьте, что вы пошли с другом в поход. Каждый у себя в навигаторе смартфона отмечал какие-то интересные места — удобные стоянки, опасные пороги, прохождение которых описывал. Потом вернулись домой, и каждый остался при своих. Сервис позволяет собрать их вместе, слив оба набора в один, отсортировать, разложить по папкам, отредактировать описания в удобном интерфейсе на компе, добавить фотографии, ссылки, сделать при желании видимыми другим пользователям сервиса, экспортировать потом, в конце концов, для использования в навигаторах и т. д.Проект свободный (https://github.com/assador/places, сам действующий сервис пока здесь: https://places.scrofa-tridens.ru). Сейчас в планах помимо API Яндекс.Карт, которые отвечают, собственно, за карту, подключить и другие — OSM, 2ГИС и пр. Хочу добавить возможность добавлять к местам не только фото-, но и видео-, и аудиоальбомы. Развивать структуру прав и ролей пользователей, их связь друг с другом на сервисе, расшаривать библиотеки в соцсети и пр. Короче, для меня штука интересная. Читать далее
Хабр
Сервис просмотра и редактирования библиотек геометок
В 2018 решил освоить Vue.js, так, для общего развития, а как известно, лучший способ освоить язык/фреймворк/etc — начать писать. В голову пришла довольно простая идея, которая...
Vuetify — создаем свое простое приложение
https://habr.com/ru/post/575050/?utm_campaign=575050&utm_source=habrahabr&utm_medium=rss
В этой небольшой статье мы с вами напишем свое простое приложение по типу "заказа еды". Само приложение если что будет статичным и здесь главный упор будет сделан на использование компонентов Vuetify и рассмотрение того как именно они работают. Также добавлю что здесь мы не будем рассматривать отдельную библиотеку Bootstrap Vue которую использует Vuetify чтобы строить гриды. Читать далее
https://habr.com/ru/post/575050/?utm_campaign=575050&utm_source=habrahabr&utm_medium=rss
В этой небольшой статье мы с вами напишем свое простое приложение по типу "заказа еды". Само приложение если что будет статичным и здесь главный упор будет сделан на использование компонентов Vuetify и рассмотрение того как именно они работают. Также добавлю что здесь мы не будем рассматривать отдельную библиотеку Bootstrap Vue которую использует Vuetify чтобы строить гриды. Читать далее
Хабр
Vuetify — создаем свое простое приложение
Хоть UI библиотек или фреймворков для Vue.js не так уж и много, но Vuetify как раз здесь больше всего выделяется и по функционалу просто впереди других. Сегодня в этой небольшой статье я расскажу об...
[Перевод] Создаём одинаковое приложение 5 раз
https://habr.com/ru/post/575416/?utm_campaign=575416&utm_source=habrahabr&utm_medium=rss
На написание этой статьи меня вдохновил YouTube-канал Fireship, записывающий отличные видео о веб-разработке, крайне рекомендую их посмотреть, если вам интересна эта тема.
Вот видео с канала, в котором в 10 фреймворках создают todo-приложение:
Я решил, что не хочу тратить на это кучу времени, и в основном использовал статью как оправдание для изучения нескольких новых фреймворков, поэтому пять раз собрал одно и то же приложение. Я планирую создать простое приложение для добавления заметок, в котором пользователи могут писать текст и сохранять его как отдельные заметки. Некоторые из этих фреймворков я уже использовал для создания подобных приложений, а в других не делал ничего похожего, или даже не использовал их вообще, поэтому это будет чуть сложнее.
Читать дальше →
https://habr.com/ru/post/575416/?utm_campaign=575416&utm_source=habrahabr&utm_medium=rss
На написание этой статьи меня вдохновил YouTube-канал Fireship, записывающий отличные видео о веб-разработке, крайне рекомендую их посмотреть, если вам интересна эта тема.
Вот видео с канала, в котором в 10 фреймворках создают todo-приложение:
Я решил, что не хочу тратить на это кучу времени, и в основном использовал статью как оправдание для изучения нескольких новых фреймворков, поэтому пять раз собрал одно и то же приложение. Я планирую создать простое приложение для добавления заметок, в котором пользователи могут писать текст и сохранять его как отдельные заметки. Некоторые из этих фреймворков я уже использовал для создания подобных приложений, а в других не делал ничего похожего, или даже не использовал их вообще, поэтому это будет чуть сложнее.
Читать дальше →
Компактные Vue компоненты из самописных SVG иконок
https://habr.com/ru/post/577202/?utm_campaign=577202&utm_source=habrahabr&utm_medium=rss
История вопроса
В этой статье пойдёт речь о том, как я пришёл к тому, чтобы взяться писать плагин, создающий на лету vue компоненты из самописных svg иконок во время сборки проекта, о том, как я это делал, и о том, что в итоге получилось.
Мне уже давно и прочно нравится мир Vue. Особенно завораживает скорость, с которой в нём рождаются новые возможности писать код более лёгким и понятным. Недавно появились Composition API, VueUse, Vite… По ходу освоения этих новых инструментов я нашёл шаблон Vitesse, буквально насыщенный удобными средствами — и для управления макетами (layout), и для маршрутизации, и для локализации и ещё для много чего… Возможно, есть смысл написать отдельный обзор этого арсенала по русски (чего в Интернете пока ещё нет). Но сейчас речь не об этом. Читать дальше →
https://habr.com/ru/post/577202/?utm_campaign=577202&utm_source=habrahabr&utm_medium=rss
История вопроса
В этой статье пойдёт речь о том, как я пришёл к тому, чтобы взяться писать плагин, создающий на лету vue компоненты из самописных svg иконок во время сборки проекта, о том, как я это делал, и о том, что в итоге получилось.
Мне уже давно и прочно нравится мир Vue. Особенно завораживает скорость, с которой в нём рождаются новые возможности писать код более лёгким и понятным. Недавно появились Composition API, VueUse, Vite… По ходу освоения этих новых инструментов я нашёл шаблон Vitesse, буквально насыщенный удобными средствами — и для управления макетами (layout), и для маршрутизации, и для локализации и ещё для много чего… Возможно, есть смысл написать отдельный обзор этого арсенала по русски (чего в Интернете пока ещё нет). Но сейчас речь не об этом. Читать дальше →
Vite.js и Vue.js
https://habr.com/ru/post/580064/?utm_campaign=580064&utm_source=habrahabr&utm_medium=rss
Я нашёл только 3 статьи по Vite.js на Хабр, там были некие обзоры функционала и описание фишек данного инструмента.Хорошо, тогда вопрос, что же это за инструмент такой и в чем преимущества использовать его при разработке? Если мы зайдем на официальный сайт - то здесь выделяется 6 основных фишек: Читать далее
https://habr.com/ru/post/580064/?utm_campaign=580064&utm_source=habrahabr&utm_medium=rss
Я нашёл только 3 статьи по Vite.js на Хабр, там были некие обзоры функционала и описание фишек данного инструмента.Хорошо, тогда вопрос, что же это за инструмент такой и в чем преимущества использовать его при разработке? Если мы зайдем на официальный сайт - то здесь выделяется 6 основных фишек: Читать далее
Хабр
Vite.js и Vue.js
Я нашёл только 3 статьи по Vite.js на Хабр, там были некие обзоры функционала и описание фишек данного . Хорошо, тогда вопрос, что же это за инструмент такой и в чем преимущества использовать его при...
Разработка документации на VuePress
https://habr.com/ru/post/580894/?utm_campaign=580894&utm_source=habrahabr&utm_medium=rss
VuePress представляет собой минималистичный генератор статичных сайтов, оптимизированный для написания технической документации.Изначальной целью VuePress, была поддержка фреймворка Vue.js и сопутствующей инфраструктуры. Для примера, можно посмотреть любую документацию по Vue: Vue.js, Vue Router, Vuex, где применяется единый стиль, заложенный в основе VuePress.В ходе статьи мы разберем архитектуру VuePress, разработаем базовое приложение и выложим на GitHub Pages. Читать далее
https://habr.com/ru/post/580894/?utm_campaign=580894&utm_source=habrahabr&utm_medium=rss
VuePress представляет собой минималистичный генератор статичных сайтов, оптимизированный для написания технической документации.Изначальной целью VuePress, была поддержка фреймворка Vue.js и сопутствующей инфраструктуры. Для примера, можно посмотреть любую документацию по Vue: Vue.js, Vue Router, Vuex, где применяется единый стиль, заложенный в основе VuePress.В ходе статьи мы разберем архитектуру VuePress, разработаем базовое приложение и выложим на GitHub Pages. Читать далее
Хабр
Разработка документации на VuePress
Описание инструментаVuePress представляет собой минималистичный генератор статичных сайтов, оптимизированный для написания технической документации.Изначальной целью VuePress, была поддержка...