Alexander Gekov
Alexander Gekov
  • 9
  • 56 957
Vue.js Global Summit | Crafting Non-geographic Maps using Leaflet and Vue
Hey everyone, this is the recording from my talk at the Vue.js Global Summit by Geekle - Crafting Non-geographic Maps using Vue and Leaflet
LET'S CONNECT:
Instagram: alexander.gekov
Facebook: alexander.gekov00/
Twitter: AlexanderGekov
TikTok: www.tiktok.com/@alexander.gekov
Github: github.com/alexander-gekov
zhlédnutí: 1 005

Video

My FAVOURITE new feature from Vue 3.3
zhlédnutí 1,6KPřed rokem
Thank you all for the 500 subscribers! In this video, we go over Vue 3.3 which was released a couple of weeks ago. My favorite new feature is the defineModel macro and in this video, I show you why I like it so much. LET'S CONNECT: Instagram: alexander.gekov Facebook: alexander.gekov00/ Twitter: AlexanderGekov TikTok: www.tiktok.com/@alexander.gekov Githu...
RECREATING THE WORST VOLUME CONTROLS in Vue.js
zhlédnutí 455Před rokem
Hey guys, I haven't posted in a while because I was busy with uni and stuff. Today, we're recreating some of the worst volume control UIs using Vue! Link to original article: uxdesign.cc/the-worst-volume-control-ui-in-the-world-60713dc86950 Link to source code: github.com/alexander-gekov/vue-worst-volume-controls LET'S CONNECT: Instagram: alexander.gekov Facebook: al...
This Tailwindcss tip changes everything
zhlédnutí 10KPřed rokem
One useful way to organize our tailwind classes and keep our template clear and easy to read is to use the Tailwind Prettier Plugin - which automatically sorts all of our classes. USEFUL LINKS: Tailwind Docs: tailwindcss.com/ Eslint Docs: eslint.org/ Prettier Docs: prettier.io/ Prettier Tailwind Plugin: tailwindcss.com/blog/automatic-class-sorting-with-prettier MUSIC: ‘balloon (royalty free vlo...
Pinia - Crash Course for Beginners
zhlédnutí 2KPřed rokem
Pinia is a state management library for Vue.js. It is an easy and lightweight way to manage state and is the successor to Vuex. USEFUL LINKS: GitHub Pinia Starter Template: github.com/alexander-gekov/pinia-cart-tutorial/tree/template Pinia Docs: pinia.vuejs.org/ CHAPTERS: 00:00 Intro 00:15 What is Pinia? 1:41 Project Overview 2:29 Creating First Pinia Store 3:32 Continuing the project 8:16 Tips...
Better Modals using Vue Teleport
zhlédnutí 7KPřed rokem
In this video, I will show you how to create better modals using Vue 3 components such as Teleport, and Transition. We will also learn about composables and dynamic Vue components. LINKS: Github: github.com/alexander-gekov/modal-tutorial Blog: dev.to/alexandergekov/creating-better-modals-using-vue-teleport-3cd4 MUSIC: ‘balloon (royalty free vlog music)’ by ‘lukrembo’ • lukrembo - balloo... LET'...
Build a BLOG with Nuxt 3 & Storyblok
zhlédnutí 9KPřed rokem
In this video, we will be building our very own blog using the help of Nuxt 3 and the Storyblok module. USEFUL RESOURCES: dev.to/alexandergekov/build-a-blog-with-nuxt-3-storyblok-3a7g www.storyblok.com/tutorials nuxt.com/modules/storyblok vueschool.io/courses/jamstack-the-complete-guide www.netlify.com/ MUSIC: ‘balloon (royalty free vlog music)’ by ‘lukrembo’ czcams.com/video/Byg7QBAbf90/video....
First Look at Nuxt DevTools
zhlédnutí 7KPřed rokem
In this video, we will look at Nuxt DevTools which offers a set of visual tools available right inside your Nuxt app. USEFUL RESOURCES: Nuxt DevTool Github: github.com/nuxt/devtools Development Experience with Nuxt by Anthony Fu: antfu.me/posts/nuxt-dx-2023 Nuxt Docs: nuxt.com/docs/getting-started/introduction LET'S CONNECT: Instagram: alexander.gekov Facebook: alexa...
Introduction to Nuxt 3: Building a Movie App
zhlédnutí 18KPřed rokem
* The Intuitive Web Framework: nuxt.com/ * VueUse: vueuse.org/ * Windi CSS: windicss.org/ * The Movie Database (TMDB): www.themoviedb.org/ LET'S CONNECT: Instagram: alexander.gekov Facebook: alexander.gekov00/ Twitter: AlexanderGekov TikTok: www.tiktok.com/@alexander.gekov Github: github.com/alexander-gekov

Komentáře

  • @SolPro999
    @SolPro999 Před 29 dny

    Super helpful thank you so much

  • @sharabhmishra8754
    @sharabhmishra8754 Před měsícem

    thanks man, helped a ton. I was thinking we had to change something in prettier json settings. Now realised just had to create a seperate file .prettierrc

  • @thesparkdev6665
    @thesparkdev6665 Před měsícem

    Thank you Alex!! this was very fun to follow along!

  • @michael0neophytou
    @michael0neophytou Před 3 měsíci

    Congrats Alexander ! Very enjoyable and useful video!

  • @adityamondal506
    @adityamondal506 Před 5 měsíci

    Hey I am not able to display all the articles in the /blog how to do that

  • @badakml7366
    @badakml7366 Před 6 měsíci

    for you guys who still dont work, this is the tips that work for me 1. paste this code in .prettierrc.json instead of empty object { "plugins": [ "prettier-plugin-tailwindcss" ] } 2. reload vscode 3. trigger headwind by pressing below button (you need only trigger once) Pressing CMD + Shift + T on Mac Pressing CTRL + ALT + T on Windows 4. the formatting now work whenever you save file

  • @hymerrathebarbarian
    @hymerrathebarbarian Před 6 měsíci

    doesnt work for me for some reason

    • @umalishonuy7977
      @umalishonuy7977 Před měsícem

      I don't know how relevant this is, but instead of the empty .prettierrc.json file that you create in the project, write there - { "plugins": ["prettier-plugin-tailwindcss"] }. It worked for me

  • @DrZlo19
    @DrZlo19 Před 6 měsíci

    Нукс... Колхоз из СНГ палится по одному слову. Если ты Русак, зачем записывать видео на другом языке?

  • @AmoahDevLabs
    @AmoahDevLabs Před 7 měsíci

    Great insight. Thanks very much. Looking forward for more.

  • @thomasnarkiss6319
    @thomasnarkiss6319 Před 8 měsíci

    Thanks for the tip, although..... For me keeping the .prettierrc.json content with nothing but { } wasn't so helpful. In order to make the plugin work you also need to paste the following iin the .prettierrc.json file: { "plugins": ["prettier-plugin-tailwindcss"] }

  • @bobdpa
    @bobdpa Před 8 měsíci

    Great info here. Thank you!

  • @erich_21
    @erich_21 Před 9 měsíci

    Хорошая работа! Спасибо за гайд.

  • @steef231
    @steef231 Před 10 měsíci

    I receive this error in the preview of Storyblok: SSL_ERROR_RX_RECORD_TOO_LONG How do I fix this?

  • @user-nb1ui6kl6g
    @user-nb1ui6kl6g Před 11 měsíci

    Тебя очень сильно акцент выдает)))

    • @indexzet
      @indexzet Před 11 měsíci

      что именно выдает?

  • @felixenriqueveganolasco4412
    @felixenriqueveganolasco4412 Před 11 měsíci

    Anyone knows why it doesn't format the existing code?, it just formats the new code (like a new <p />, etc)

  • @user-nf1td4hh7y
    @user-nf1td4hh7y Před 11 měsíci

    thanks for uour work! its very usefull

  • @vivianliu5011
    @vivianliu5011 Před 11 měsíci

    one problem in your code. your page number is 1 based. so it should NOT + 1 as in your video. It should be like below const disabledNext = computed(() => { return page.value === data.value?.total_pages; });

  • @mauricebagalwa6923
    @mauricebagalwa6923 Před rokem

    An interesting video for us new Nuxtjs developers... Thank you very much 🙏

  • @hosseinpanahy5358
    @hosseinpanahy5358 Před rokem

    Your quality is awesome

  • @hosseinpanahy5358
    @hosseinpanahy5358 Před rokem

    Create more nuxt projects

  • @KuroManX
    @KuroManX Před rokem

    The way you created that composable was very clever, thanks for sharing!

  • @selimdoyranli
    @selimdoyranli Před rokem

    thanks dmitry

  • @JoaoLucas-tw2pt
    @JoaoLucas-tw2pt Před rokem

    thank you mate

  • @user-lf3ev6zv5q
    @user-lf3ev6zv5q Před rokem

    21:05 can explain how the useFetch is recalling it self when the searchTerm changes wihout using the watch function ?

    • @alexandergekov
      @alexandergekov Před rokem

      Hello, it is because we are passing a variable that is computed and useFetch composable is smart enough so when the underlying url changes, it performa a data fetch again.

    • @user-lf3ev6zv5q
      @user-lf3ev6zv5q Před rokem

      @@alexandergekov u are right it's strange to me how it works out of the box , any way great video!

    • @user-lf3ev6zv5q
      @user-lf3ev6zv5q Před rokem

      okay i find out that refs and reactivity in general in vue are using effects under the hood which basically what nuxt does with useFetch,

  • @xxXXuser69420XXxx
    @xxXXuser69420XXxx Před rokem

    -Mom can we get fireship? -We got fireship at home, Timmy fireship at home:

  • @sayapterbang9976
    @sayapterbang9976 Před rokem

    Awesome, very helpful. ill subscribe this channel

  • @8BitNeuron4808
    @8BitNeuron4808 Před rokem

    Thanks for this video. I was able to move forward with my project.

  • @khanriza
    @khanriza Před rokem

    Well explained and indeed a great feature...

  • @iordanlaurentiu4276

    Hey Alex! This is a pretty nice tutorial and it helps me, as a junior developer, to understand lots of things. However I have a problem that I can't solve. It tells me i'm unauthorized to use the API, even tho my API key has been approved. Do you have any idea what it may be?

    • @daviddume1077
      @daviddume1077 Před rokem

      i had the same problem. i solved adding this to search.js ${config.apiBaseUrl}/search/movie?query=${query}&api_key=${config.apiKey}

  • @lilg4457
    @lilg4457 Před rokem

    how to write the useAsyncData/useFetch function so that the api data is loaded on F5, and not just on a click on the client route?

  • @maxkosh4839
    @maxkosh4839 Před rokem

    I did exactly as you did and it doesn't work.. any suggestions why?

  • @codingoblin
    @codingoblin Před rokem

    Nice video mate 😃

  • @kamesh312
    @kamesh312 Před rokem

    Nice tutorial Alexander.

  • @user-wo2hl8jd8h
    @user-wo2hl8jd8h Před rokem

    In my case, renderRichText only renders the styling, but not elements. Everything is being rendered as like p, however when I inspect it, elements are correct, e.g. h1, li, but all look like a p tag. Do you know why ?

  • @luisangelcortezgrijalva6778

    i can't install dotenv

  • @user-rs4yp1pk1h
    @user-rs4yp1pk1h Před rokem

    Very well explained and useful. Similar use-cases could be to book seats on an airplane or bus or for a conference. Well done!

    • @user-rs4yp1pk1h
      @user-rs4yp1pk1h Před rokem

      ​@@alexandergekov Do you have any thoughts about adding layers (for example a 2nd floor of the theater)? Would it be better to have a separate map for each layer/floor or a different view? Possibly a controller could be added to select (or reveal) a layer/floor.

    • @user-rs4yp1pk1h
      @user-rs4yp1pk1h Před rokem

      @@alexandergekov Thank you! Sounds good. I am just wondering if we lose some functionality by doing this. For example, will it be possible to select seats on the second floor? I guess we will need an array of seats (and selected seats) for each floor. Also, the seating map of the second floor will probably be different from the first floor. Anyway, I will try it. Thanks again.

  • @PhillipMwaniki
    @PhillipMwaniki Před rokem

    It's really easy to understand how you explain Vue concepts.

  • @charlespiresrodrigues

    fast, direct and extremely understandable. you have the gift Thanks Alexander..

  • @YellowPanamka
    @YellowPanamka Před rokem

    Саня нормас, спасибо.

  • @nested9301
    @nested9301 Před rokem

    Can we create relationships between the data like an author can have many blog ect

  • @виртуоз_ру

    👍

  • @dreykanbern1453
    @dreykanbern1453 Před rokem

    Hi, thanks for the video, is your approach described in the documentation?

  • @StallionTG
    @StallionTG Před rokem

    boggles the mind this was not a priority #1 feature in the base version of vue3.

  • @ropodl
    @ropodl Před rokem

  • @KuroManX
    @KuroManX Před rokem

    Thank you for this tutorial, very well explained could ruin it without any problem. The nuxt community is so poor in tutorials is good to see people doing good content. Please, make a video about error handling, good practices when using APIs, and validating fields.

  • @PabloMartinezfr
    @PabloMartinezfr Před rokem

    Amazing video!

  • @freulerGuenter
    @freulerGuenter Před rokem

    can we create specific type for Genres of Movie?

  • @freulerGuenter
    @freulerGuenter Před rokem

    awesome

  • @shavkatortikov4558
    @shavkatortikov4558 Před rokem

    Nice work, thank you.

  • @user-yy6wb5nm4s
    @user-yy6wb5nm4s Před rokem

    Great job, bro ! Let's suppose we have a form with a submit button on each of the two modals. In the same logic, how to manage the submission of data to a database. And how to close the modal automatically if the submission was successful. Thanks!