How to Use the Shopify API and Make GraphQL Requests

แชร์
ฝัง
  • เผยแพร่เมื่อ 3 ก.ค. 2024
  • Learn how to make GraphQL requests and work with the Shopify API.
    ⭐ Shopify Editions Page 2024
    --------------------------------------------------------------------------
    www.shopify.com/editions?utm_...
    ► Free Help
    --------------------------------------------------------------------------
    🎯 Get Personal Career Advice for Shopify Developers:
    codingwithjan.com/personal-ca...
    👨‍💻 Find a qualified Shopify Developer for your next project:
    codingwithjan.com/hire-a-deve...
    ► Contact
    --------------------------------------------------------------------------
    🌐 Website
    codingwithjan.com
    🤝 LinkedIn
    / jan-frey
    ► Resources
    --------------------------------------------------------------------------
    Shopify Documentation on Input settings
    shopify.dev/docs/api/admin-gr...
    Getting started with GraphiQL
    shopify.dev/docs/apps/tools/g...
    Shopify API Rate Limits
    shopify.dev/docs/api/usage/ra...
    Timestamps
    00:00 Today's Video
    00:22 Understanding Shopify's API
    01:29 GraphQL Carsh Course
    03:32 Writing your first GraphQL Query
    05:57 Understanding the Server Response
    08:31 Practise GraphQL Requests from your own App
    12:03 Make API Requests via Client Libraries
    15:23 Updates from Shopify Editions
    16:30 Outro
    🔍 SEO Description
    --------------------------------------------------------------------------
    GraphQL is the recommended query language for working with Shopify's API.
    The Admin API lets you build apps and integrations that extend and enhance the Shopify admin. Developers can request (read or write) data regarding products, collections, orders, customer information, or the shop itself.
    In this GraphQL tutorial, we're learning the Syntax, and how you can get started writing your first GraphQL requests. Further, we explore how to test your queries and later how to make Shopify API requests from your own apps. In summary, this video serves as a full guide to working with the Shopify API by using GraphQL.
    codingwithjan.com

ความคิดเห็น • 45

  • @CodingWithJan
    @CodingWithJan  2 หลายเดือนก่อน

    🎯 Get Personal Career Advice for Shopify Developers:
    codingwithjan.com/personal-career-advice
    👨‍💻 Find a qualified Shopify Developer for your next project:
    codingwithjan.com/hire-a-developer

  • @liamgriffin9526
    @liamgriffin9526 3 หลายเดือนก่อน

    Awesome video Jan! Great to see you running the queries from the app as well as how to test/learn with graphiql

  • @saharrsaber
    @saharrsaber หลายเดือนก่อน

    Super clear, Thank you!

    • @CodingWithJan
      @CodingWithJan  หลายเดือนก่อน +1

      Glad it helped! :-)

  • @Lizhiaa
    @Lizhiaa 3 หลายเดือนก่อน +1

    Thank you for this video, you are the first that I watch that ACTUALLY explains what the code in the test app does. But I would love to see another video where you go more into detail about making more api-requests through a button click. I would also love to know how I can make that request from a button click on the storefront and not through a button click in the app (my use case is that the customer needs to update their metafield value, so I don't really need a front-end for my particular app only a back-end app). I have watched tons of videos and I am still quite lost but will get there eventually. Just really wanted to say that I appreciate your videos :D

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน +1

      Thank you Liz 😄
      Loved the feedback, and agree that these use cases would be helpful to see too!

  • @StefanW87
    @StefanW87 3 หลายเดือนก่อน

    Thank you Jan for sharing!

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน

      More than welcome 😄🙌

  • @celebGPT
    @celebGPT 3 หลายเดือนก่อน

    Very Informative

  • @andrewcpark
    @andrewcpark 3 หลายเดือนก่อน

    Awesome overview of graphql!

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน +1

      Thank you, Andrew! 💪
      Are you already tapping into app development?

    • @andrewcpark
      @andrewcpark 3 หลายเดือนก่อน

      @@CodingWithJan not quite yet but good to know!

  • @gus24x24
    @gus24x24 3 หลายเดือนก่อน

    Great video, I hope there is more in the future regarding app development. Especially using vanilla JS!

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน

      Haha, probably not vanilla!
      Highly recommend using the packages, and react components if you don't want to be coding forever 😄

  • @_Software_developer_
    @_Software_developer_ หลายเดือนก่อน

    very informative

  • @matthewpill88
    @matthewpill88 3 หลายเดือนก่อน +1

    Great video as always! It would be good to run through a couple examples of when you'd build out a custom app. I always struggle with example cases of when I'd actually need to go down the custom app development route rather than using what Shopify natively has to offer or from using third party apps that already exist... I'm coming from it with only custom theme development experience though!

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน

      Awesome feedback! :-)
      What kind of requests would you like to see?
      Also, what tech stack for building apps? (just the default remix starter template?)

    • @ShopifyLearner-ng3il
      @ShopifyLearner-ng3il 3 หลายเดือนก่อน

      Can we use this to create discount based on payment gateway with this?

  • @mudassarz.6762
    @mudassarz.6762 2 หลายเดือนก่อน

    That was super helpful! Can you also explain how to query GraphQL from an app extension (e.g. querying customer data from a post-purchase UI)?

  • @mindaugaslukosiunas
    @mindaugaslukosiunas 4 วันที่ผ่านมา

    By any chance you could guide me how to update metaobject definition on the app update when releasing a new version?

  • @deerajt3166
    @deerajt3166 17 วันที่ผ่านมา

    Hi
    how can we fetch home page content(rendered via sections on theme customizations) or fetch via template names?

  • @alexandercruz7107
    @alexandercruz7107 หลายเดือนก่อน

    Do you know how I can change the logo link and in the version I am using in the bottom right corner there is a link "return to car". how can I hide it?

  • @joelleon8712
    @joelleon8712 หลายเดือนก่อน

    Thank you for the video, but what if you want to populate dynamically?

    • @CodingWithJan
      @CodingWithJan  หลายเดือนก่อน

      what does that even mean?

  • @hariprasanths2973
    @hariprasanths2973 2 หลายเดือนก่อน

    Brother...
    I'm looking for the Shopify API endpoint to include tracking number and shipping company details before the order status is marked as fulfilled. What's the appropriate endpoint for this?

  • @KhasimAli-pv9zm
    @KhasimAli-pv9zm หลายเดือนก่อน

    Thanks for the video! Can you please let me know if a customer can update his email or any other field from his account through the storefront. I have not seen an option to edit the details from the storefront.

    • @CodingWithJan
      @CodingWithJan  หลายเดือนก่อน +1

      Per default they can't.
      Would be possible via apps / custom apps.

  • @mako_cp
    @mako_cp 2 หลายเดือนก่อน

    Hey Jan, how can I setup a development shop for testing purposes or is here a real shop for this needed? thanks

    • @CodingWithJan
      @CodingWithJan  2 หลายเดือนก่อน +1

      Create a "Shopify Partners" account (free)
      and then create a new development store.

  • @dystopian_1
    @dystopian_1 3 หลายเดือนก่อน

    Great content

  • @sarveshkapoor7177
    @sarveshkapoor7177 3 หลายเดือนก่อน

    Hi Jan I am following you and like your content but can you start a new series on how to build shopify theme from scratch or use any free theme to complete it for a e-commerce website I hope other are also looking for that.

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน +1

      Hey there,
      for free resources, I'd recommend checking my "theme development" playlist.
      (this is more for theme customizations than building one from scratch, but also what I'd recommend when getting started.)
      For a full end-to-end curriculum, portfolio reviews, code reviews, mentoring, and support while working on your first real client projects, our bootcamp Freemote might be a good fit.
      Cheers!

    • @sarveshkapoor7177
      @sarveshkapoor7177 3 หลายเดือนก่อน

      @@CodingWithJan thanks for replying I appreciate you suggestions I will work around them ❤️

  • @merrittwitherspoon7894
    @merrittwitherspoon7894 2 หลายเดือนก่อน

    Do you have to use GraphQL with a Storefront API? I'm building headless ecomm that flows from Shopify to iOS & visionOS Apple apps. Thanks!

    • @CodingWithJan
      @CodingWithJan  2 หลายเดือนก่อน +1

      Unfortunatley not yet.

    • @merrittwitherspoon7894
      @merrittwitherspoon7894 2 หลายเดือนก่อน

      @@CodingWithJan Cool, good to know GraphQL is not associated with using Shopify’s Storefront API. Thanks for the reply 👍

  • @shaluchaudhary908
    @shaluchaudhary908 2 หลายเดือนก่อน

    Hey can you help me with authentication token key so that if I want to sell my theme then no one can use it with token key..
    I want to do this with custom code...no apps

    • @CodingWithJan
      @CodingWithJan  2 หลายเดือนก่อน

      Unfortunatley not possible, because if your validation code was right in the theme, people would have access to it and can just remove it

  • @asmamalik0165
    @asmamalik0165 3 หลายเดือนก่อน

    Is it possible with API we can manage the checkout page in the Shopify plan? Like I want to add a city dropdown through google API but shopify page is rejecting the script

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน

      you might want to look into checkout extensions

  • @paquitafadden6068
    @paquitafadden6068 3 หลายเดือนก่อน

    Hi Jan,
    I am creating a public Theme Extension Block App using the new Remix infrastructure. Is it possible to send a GET to my API and have that run a GraphiQL query for me and return the information? Is this how we can use GraphiQL with our apps or do I misunderstand how we can use GraphiQL? It seems silly to save information in my APP/database that is a duplicate of Shopify information. Are you able to demonstrate the code to achieve such a thing? It's proving challenging.

    • @CodingWithJan
      @CodingWithJan  2 หลายเดือนก่อน

      Hi, so you can't send API requests from the theme (frontend).
      When a user visits the website, all file are downloaded to their machine.
      So if you could make API requests from there, they would also have the secret API keys, which would be a security issue.
      If you have a app/theme extension, this would trigger an action inside your app, and the app would make the graphQL request from the server.
      Hope this way it makes sense 😄

  • @michaelm8044
    @michaelm8044 3 หลายเดือนก่อน

    Is it possible to use shopify-cli with this?

    • @CodingWithJan
      @CodingWithJan  3 หลายเดือนก่อน +1

      Hi Michael,
      please specific "this"
      For example when we're creating the app, it's actually done via Shopify's CLI. (App CLI)

    • @michaelm8044
      @michaelm8044 3 หลายเดือนก่อน

      @@CodingWithJan sorry, I noticed you use 'npm run dev'. Is it the same as using 'shopify theme dev'? That's usually the command I use