single-page-applicationmagento2magento-rest-api

In Magento can I build my storefront solely on Magento REST API?


Is it possible to use Magento 2.4 solely as a store admin panel and REST API?

I would like to build my store front as a SPA/MPA/NodeJS application that has nothing to do with neither PHP, nor Magento templates etc. but only uses my Magento backend installation via its REST API?

Does the API gives me full control on the backend data for the common store front needs (search and buy products and the ilke)?

Does the API allows to create my custom endpoints?


Solution

  • Sure, you can check all available REST API methods on /swagger page of you Magento2 instance (e.g. https://local.magento2.com/swagger) or in Magento2 Documentation https://magento.redoc.ly/

    You can also easily create custom enpoints via etc/webapi.xml, e.g.

    <?xml version="1.0"?>
    <routes xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Webapi:etc/webapi.xsd">
    <!-- with admin token -->
        <route url="/V1/customers/sample/admin" method="POST">
            <service class="Vendor\Customer\Api\AccountManagementInterface" method="initiateAccountReset"/>
            <resources>
                <resource ref="Vendor_Customer::restore"/>
            </resources>
        </route>
    
    <!-- with customer token -->
        <route url="/V1/customer/sample" method="POST">
            <service class="Vendor\Customer\Api\AccountManagementInterface" method="sample"/>
            <resources>
                <resource ref="self"/>
            </resources>
            <data>
                <parameter name="customerId" force="true">%customer_id%</parameter>
            </data>
        </route>
    
    <!-- anonymous -->
        <route url="/V1/customer/sample/anonymous" method="POST">
            <service class="Vendor\Customer\Api\AccountManagementInterface" method="sample"/>
            <resources>
                <resource ref="anonymous" />
            </resources>
        </route>
    </routes>