14 Dec 2021
WordPress + SvelteKit integration API source code free gratis download
WordPress + SvelteKit integration API source code free gratis download
Built a modern website with svelte kit frontend and wordpress for backend, if you need to integration wordpress website with svelte kit so you can download this source code, for make modern website with single page application. in this free download source code grati you can learn how connect wordpress website with svelte kit. then you can change and customise themes template if you needed.Baiklah man teman wan kawan kali ini kita akan ngebaggin secara gratis lagi sebuah kode sumber terbuka, dimana kalain bisa melakukan integrasi dengan menggunakan WP sebagai backend dan sveltekit tentunya untuk frontend. yap WP cukup populer di dunia CMS sejak dari dulu ya.. hal ini karena kemudahan nya untuk digunakan baik oleh pengguna dan untuk developer bekerja merombak secara murah, dan tentunya si svelte ini juga semakin mantab aja , secara dia adalah modern js untuk membuat sebuah web app dalam single page app, selain itu ukuran nya yang mini dan cukup imut ini menjadikan pilihan menggunakan nya sebagai halaman muka untuk WP web.
Then you can install on your local devices or on cloud shared hosting, you can read documentation how to install this themes . Or you can see demo on https://axcora.my.id/wordpress .
Oke after your download this themes template , for integrate with sveltekit we need to installing svelte on your devices, so we need downloading and install third party apps, so let's get started now...
NPM Node download
We need to download and installing node so you can download node →
After donwload and install now you can test what a node version you have install on devices, so open shell terminal or command prompt, just click on windows logo and type cmd , and now you can run this command node -v
for checking node version you have install on your devices, then you can check npm version to with run command npm -v
.
Github Download
or you can clone / fork repo using shell terminal with run this command
git clone https://github.com/mesinkasir/wordpress-sveltekit.git
Oke I assume you have installing and run wordpress on localhost or cloud host , then we can integrated with this source code, we use our wordpress web ,you can visit on https://axcora.my.id/wordpress . we have complete blog article and page too.. so all article blog and page can be integrated and fetch on frontend web using wordpress API.
Now create new project folder on desktop, then you can extract download file on project folder, just copy and move all files in project folder, then we can install it with run
npm install
. after installation success now we need to run server so you can run it with npm run dev
then visit localhost:3000 and congratulations now you have built and integrate wordpress website with sveltekit web apps.
An example all blog page have successfully fetched on frontend website using sveltekit.
jadi man teman disini semua blog artikel yang sudah kita buat akan ditampilin pada halaman blog ya , dan semua nya akan terintergasi dengan sempurna disini, so makin keren kan .
For page wp web will displaying on page area
Sama seperti blog artikel sebelum nya ya disini juga halamaan page juga berhasil dan sukses untuk ditampilin disini.
Allright now how to change API from wordpress, on this case we use API from https://axcora.my.id/wordpress right ,now how i can integrated my wordpress website with this svelte kit web app ?? for first of course you need to open source code folder location on src\routes folder then you can open blog.svelte and edit using code editor. you just need to change this code
const apiURL = 'https://axcora.my.id/wordpress/wp-json/wp/v2/posts/';
change with
const apiURL = 'https://yourwebsite/wp-json/wp/v2/posts/';
your website is a your domain . so you can replace with your domain name, and save it.
Oke after blog have success to change and integrated API with your web ,now we need consume page API so you can open and edit page.svelte with code editor, then you need to change
const apiURL = 'https://axcora.my.id/wordpress/wp-json/wp/v2/pages/';
change with
const apiURL = 'https://yourwebsite/wp-json/wp/v2/pages/';
same like blog article you can change your website with your domain . and save it - congratulations now you have finished intergared wordpress website with sveltekit.
Oke now we can deploy it and live on cloud host ?? so you can read this article if you need to live and cloud your web apps.
How to cloud sveltekit with wordpress API →.
Oke we hope this article about WordPress + SvelteKit integration API source code free gratis download , help you for built modern website with wordpress as backend and svelte kit as frontend. then if you need website themes or pos application for free so you can download our source code gallery here → .
Hapy codding !!