06 Sep 2022
New Podcast Vlog Web template free download source code astro
Built podcast and vlog website with astro - free download full source code gratis
Welcome again... if you want to built a modern website for your vlog or podcast so you can use this source code project, free download and open source , you can change any code with you needed.. and we build this project with astro, a new and modern static site generator.you can download or clone on our github repo then deploy and run your podcast vlog website.
So before we start and run this project for first you need to install third party app, like code editor and node, so you can download on download list .
Halo man teman... lama tak sua, karna ada nya pekerjaan kita yes.. dan kali ini mimin mau bagiin lagi nih.. kode sumber terbuka gratis untuk mu, kemaren sempet kita ada tuh project podcast di bangun menggunakan jekyll pada salah satu client kita, dan dari situ lah ada inspirasi dan bukan konspirasi untuk membuat proyek ini. sederhana dan simple banget tentunya untuk podcast dan vlog kami , plus dukungan SEO di dalam nya dong biar makin oke... so.. unduh via github repo kami dan mulai gunain untuk membangun pembuatan website vlog dan podcast kamu.
Baiklah sebelum kita mulai ada beberapa persyaratan untuk menjalankan web app ini, salah satu nya adalah kita mesti unduh dan install node js pada perangkat mu, dan tentunya alat bantu pendukung seperti kode editor, yuk dah ah langsung aja unduh peralatan perang dan tempur nya.
NEED TO DOWNLOAD
Node JS →
Visual Code Editor →
After download all app you can install it on your device , just click next and next and finished installation. then you can open windows logo and typing cmd, and you will see command prompt - you can call it terminal , after this you can input the command
node -v
then press enter , this is for check node version on your device,and you can also check npm version with run npm -v
this command for check npm version on your device. Baiklah setelah mengunduh semua peralatan tempur kamu, maka kamu bisa jalanain perintah diatas itu ya.. untuk cek versi dari installasi node dan npm kamu. dan dilanjut saatnya kini kita mengunduh kode sumber terbuka nya.
Github Download
Clone with terminal just run
git clone https://github.com/mesinkasir/astro-podcast-vlog.git
Contibution with donation for support our team dev make other source code for the world.
Buy me a coffee ☕️ ❤️ ✌🏻Donate Now
Okay after you have clone or download source code file now you need to open extract and move all source code file on your project,for first you can create new folder on desktop , then name it your new folder with astrovlog - then you can move all source code file on this folder , and we need to accsess this folder project using terminal, so open your terminal bash, just click windows logo and typing cmd - then you see command prompt, and now you need to input this command
C:\Users\pcname\Desktop\astrovlog
need to change pcname with your pc name . and now we have accsess your project folder using terminal, before we run web app source code file, we need to install it, so you can run
npm install
, after installation success now you can run and deploy this poject on your local server, so you can run npm run dev
then open web browser and visit on localhost:3000. and congratulation... you have successfully deploy this project on your local server.
Baiklah man teman dan kawan kawan hadirin hadirot sekalian, setelah kalian mengunduh kode sumber terbuka nya, maka kini yang harus kalian lakuin adalah untuk membuat dulu folder proyek untuk kita akses dan jalankan pada localhost kamu, jadi pertama tama kini wajib berdoa dulu sesuai dengan agama masing masing... dan kemudian berkonsentrasi secara penuh.... 😄 , langsung aja deh pokok nya kamu buat folder di desktop dulu, lalu kamu pindahin deh semua kode sumber terbuka yang uda kamu unduh ini ke folder baru yang ada di desktop, petunjuk lengkap nya simak aja deh cara diatas ya... biar aku gak capek nulis kaka 😆.
okay now you can change anycode with you needed, for create a post article you can visit on src/pages/pos , you can write on markdwon or mdx files , for create new post articel vlog and podcast you can easy just create new file, then name it with yourvlog.md or youpodcast.mdx files, then copy and paste fontformater markdown file to your new post, and edit with you needed in here.. for insert video you need to embed video from youtube so you can copy link youtube and paste it in video, ingat hanya kopi bagian belakang link youtube saja. for example you have youtube video link with
https://www.youtube.com/watch?v=NLxDbnyQ4r4
and you just need copy NLxDbnyQ4r4
then insert to video format and to be like this video: 'https://www.youtube.com/embed/NLxDbnyQ4r4'
and insert description about your vlog or podcast,then save it..And we need to setup the SEO website, so you can visit on src/config.ts then change title and description with your website title and description. that's it... very easy and simple right....
Dan setelah kalian berhasil menjalankan proyek New Podcast Vlog Web template free download source code astro maka kalian bisa langsung deh buka via code editor kalian untuk bekerja, dan ubah serta oprek semau mu,,, gimana enak kagak tuh,, semau mu... ubah semua nya sesuai in dengan kebutuhan mu... 💪 , nah untuk ngebuat posting maupun gimana cara input embed podcast dan vlog kamu , ikuti petunjuk diatas ya..
DEPLOPY ON HOSTING
After you have finish change code and content with your own, now you need to build this web app, so you can use terminal then run
npm run build
you can use dist folder and upload it on your cpanel hosting , or you can push on your github repo and deploy on static hosting like vercel, netlify, cloudflare ,surge and others. if you use firebase so you can install firebase on your device, then create web app project and push on your firebase console hosting and deploy it.Fast solution you can use surge, you need to accsess dist folder using npm so run
C:\Users\pcname\Desktop\astrovlog\dist
then install surge using terminal with run npm install --global surge
then register on surge with run surge
and insert your id in here.. select your domain name and deploy it... and now your site is live !!ONLINE DEPLOY
So if you want to deploy it on host and use online IDE so you can create account and register on github first, after you have register and login on your github account now you need to fork our repo, just visit on https://github.com/mesinkasir/astro-podcast-vlog and click fork it or click here for fast fork on your repo → , after you have fork it, congratulations you have copy our source code file on your repo, now we need to create account and register on netlify or you can use cloudflare / vercel. use your github account for register, after you have register and login on admin panel , so you can click create new project - name it this project with your domain - and click integration with your github account - select your repo - and deploy it... that's it.. you have successfully deploy your site, for edit this sourcecode you can easy with accsess on github repo and edit file with you needed in here.. or you can use https://github.dev/ for online IDE by github. USE ONLINE IDE AND DEPLOY LIVE
if you want you can easy for live your website with using stackblitz - you need register on stackblitz and register to on github for integration your repo , how to work ?? just simple, you can fork this our IDE , after you have fork it , now you can change code with you needed, after that you need to integration with github account , so click connect repo - this step for create new repo from online IDE by stackblitz to your github repo. and name it repo, and click commit button. last step we need to live on static host, so you can register on vercel or netlify use your github account, then create new project - select your repo from stackblitz and deploy it... congratulations you have successffully deploy and create modern podcast vlog website with astro.
Hey.. you can view our source code file in here... change any code with you needed, and you can run this project now with live server. run this project now..
BONUS CONTENT !!
Astro Vlog Podcast source code download →
Astroman full source code download →
Cuteblog Astro full source code download →
Astro Landing Page full source code download →
Astro Simple starter full source code download →
All source code project free download →
Mesin kasir terbaru →