Laravel PDF Magic: From Dynamic Views to Beautiful PDFs with Spatie Browsershot

แชร์
ฝัง
  • เผยแพร่เมื่อ 14 ต.ค. 2024
  • Source code: github.com/gle...
    Want to create stunning, downloadable PDFs from your Laravel app's dynamic views? Look no further! This video unveils the magic of Spatie Browsershot, transforming your Laravel application into a PDF powerhouse. Learn how to generate beautiful, print-ready PDFs effortlessly, saving you time and frustration.
    #laravel #pdf #SpatieBrowsershot #webdevelopment #laraveltutorial #php #DynamicViews #PDFGeneration #coding #webdeveloper

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

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

    It's pretty cool I guess I would try that Library. Another Cool Video. Please keep it up

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

      @@wormy_coder thank you! 🙏

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

    OMG this is what I have been looking for! Thanks for posting.

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

      You're welcome, In a couple of minutes I'll be posting a new video about advanced searching with Laravel Scout (Meilisearch).

  • @StevenTohme
    @StevenTohme 3 หลายเดือนก่อน +2

    Your vscode theme looks super dope! What'd you use to make it look like this?

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

      I used the "Custom CSS and JS Loader" extension in order to customize some parts of the interface. You can define your styles in CSS to modify VSCode's UI.

  • @miltonchowdhury4016
    @miltonchowdhury4016 8 วันที่ผ่านมา

    wow..this looks awesome and very helpful..... If I want to add the page number of the bottom right, then how to add it, plz tell us, thanks once again...

    • @glennraya
      @glennraya  8 วันที่ผ่านมา +1

      You can add page numbers by enabling the header and footer of Browsershot: spatie.be/docs/browsershot/v4/usage/creating-pdfs

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

    Is it necessary to store PDF files on the server? Can we use something like stream() in dompdf so that the PDF files don't need to be stored?

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

      Hi, yes definitely. You can also directly download PDFs or open it in a new browser tab. You don't have to necessarily save it on the server.

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

    ang galing niyo po

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

      ahaha, salamat 😀

  • @dark-time-programer3306
    @dark-time-programer3306 หลายเดือนก่อน

    very good explanation

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

      Thank you!

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

    Could you please provide me with the settings.json file that looks fabulous?

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

      Here's all my settings (github.com/glennraya/vscode-settings-json), you can install "Custom CSS and JS Loader" vscode extension, I made some mods to it since this video, you can refer to my latest video (th-cam.com/video/y1bj5xBl8Ag/w-d-xo.html) on this channel to see how it looks.

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

    hi, thanks for the package , Often, we want to stream the PDF ... you didn't mention that part

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

      Correct, I should've streamed it. But anyway, this video is about generating PDFs. Next time I'll carefully consider things when making a video. Thanks.

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

      @@glennraya thanks, 👌

  • @itsmeka
    @itsmeka 15 วันที่ผ่านมา

    The page number is important in PDF documents. Is there any way to add page numbers, and repeat header and footer?

    • @glennraya
      @glennraya  15 วันที่ผ่านมา +1

      I believe page numbers can be added. Kindly consult Browsershot's docs for that. For headers and footers, you can try fixed positioning in CSS to make available on every page.

    • @itsmeka
      @itsmeka 15 วันที่ผ่านมา

      @@glennraya I have checked their docs and found its possible. thank you very much :)

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

    Hello, could you please show how we could set up this on a linux production server? A week ago I used this package and everything was perfect on local during development. But it was a nightmare when it came to using it in production unit I had to abandon it and use Dompdf instead.

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

      I will consider it, make sure your production server meets the requirements for Browsershot by checking their documentation since not all servers are configured the same. You may also refer to puppeteer's docs: pptr.dev/troubleshooting#chrome-doesnt-launch-on-linux. And also Spatie's requirement guide: spatie.be/docs/browsershot/v4/requirements#content-custom-node-and-npm-binaries

  • @videolocos413
    @videolocos413 วันที่ผ่านมา

    greetings good video I am having problems to show logo in the header ->headerHtml($headHtml),
    of the page when I call from the database the logo doesn't show me anything and neither from the public/img/logo.png folder.

    • @glennraya
      @glennraya  วันที่ผ่านมา

      You may need to also call the ->showBrowserHeaderAndFooter() method.

  • @bolence79
    @bolence79 8 วันที่ผ่านมา

    The header and footer are showing as not working as expected. I tried everything from documentation.

    • @glennraya
      @glennraya  8 วันที่ผ่านมา

      some people have tried to make a header/footer by making it a "fixed" container to make it available on all pages.

    • @bolence79
      @bolence79 8 วันที่ผ่านมา

      @@glennraya Thanks for the answer. I tried that too, but no luck.

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

    how about laravel print automatic to printer witout pop up print screen in browser through javascript (window.print). i mean print it automatic from server side (silent print). please make this tutorial .

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

      @@yoskokleng3658 I don't think that's possible on a web interface. Maybe some form of dirty hack would do.

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

    How do Spatie Browsershot and DomPDF compare in terms of efficiency and speed for generating PDFs?

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

      I think DomPDF is faster than Browsershot because Browsershot uses puppeteer which is a node library, but IMO Browsershot can generate PDFs more accurately than DomPDF (and the API is easier too).

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

    Tailwindui library? I see a beatiful dashboard.

    • @glennraya
      @glennraya  3 หลายเดือนก่อน +4

      No, it's not tailwindUI. I made it myself, though it was inspired by the Arc browser UI, and the date range picker is from nextUI. Thanks

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

      @@glennraya Can you make a video about the dashboard

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

      ​@@scherzer6428 I don't think making a video about the dashboard is going to bring much value to people haha. Thanks for the compliment. However, I will upload a new video tomorrow, creating advanced, Google like search engine for one's projects.

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

    Sir Glenn i found difficulty in production there is an error in node any advice to fix it.

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

      What node version are you using? Puppeteer requires node version 18 and up.

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

      @@glennraya I personally was using node 22 but face the error @jimmyarb7767 is probably referring to. Issue was with node and puppeteer

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

    what's framework for css ? if i can think of the style of report design like u. my customer would love me 🤣😭

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

      @@yoskokleng3658 I use tailwindcss for the css framework.

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

    thanks idol, u have my sub

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

    can Laravel PDF Magic repeat header and footer on every page?

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

      Spatie's Browsershot package doesn't directly support including the header on every succeeding page, however, you may achieve the repeating header effect by experimenting with custom CSS, like setting the header with a fixed positioning so it "could" appear on every page.

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

    Does it support all browsers?

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

      Yes, it supports all modern browsers.

  • @pembatamang5716
    @pembatamang5716 3 หลายเดือนก่อน +2

    Symfony \ Component\ Process \ Exception\ ProcessFailedException. the error occured. idk is this the window issue or what.

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

      I think this package only works for MacOs users, not Windows or Linux.

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

    theme name please?

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

      Hi, which theme you're asking? VS Code's or the dashboard's?

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

      @@glennraya vs code

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

      @@nilanjanchakraborty2694 The theme itself is "Palenight", but my VS Code's UI is modified beyond what themes can give you, you can use "Custom CSS and JS Loader" extension to modify VS Code's UI extensively. After installing the plugin you can try my current settings: github.com/glennraya/vscode-settings-json

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

    Huui nakikita kita sa programmer code posting

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

      FB group po pa yun? haha

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

    hard to implement on windows

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

      I agree with you

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

      @@rondevPH Really? I couldn't try it, I don't have a windows machine. 😅

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

      @@glennraya good for you. That is why dompdf is the only way😅

    • @JavierHernandez-jg3wo
      @JavierHernandez-jg3wo 3 หลายเดือนก่อน

      I'm trying to get it to work with laragon on windows but I can't figure out how to get it to work.

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

      @@rondevPH hmm, can't tell for sure, Browsershot docs doesn't mention any incompatibility with Windows.

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

    Can you share the source code?

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

      Yes sure, I'll push it to github and linked on the description.

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

      github.com/glennraya/browsershot

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

      @@glennraya i got the below error when i generate pdf in windows.I already have node installed in the system.How can i solve this
      The command "node "D:\wamp64\www\browsershot\vendor\spatie\browsershot\src/../bin/browser.cjs" "{""url"":""file:\/\/C:\\Users\\Ajmal\\AppData\\Local\\Temp\\896216291-0639441001719154368\\index.html"",""action"":""pdf"",""options"":{""path"":""D:\\wamp64\\www\\browsershot\\storage\\\/app\/reports\/example.pdf"",""args"":[],""viewport"":{""width"":800,""height"":600},""displayHeaderFooter"":false,""margin"":{""top"":""4mm"",""right"":""0mm"",""bottom"":""4mm"",""left"":""0mm""},""format"":""A4"",""printBackground"":true}}"" failed. Exit Code: 1(General error) Working directory: D:\wamp64\www\browsershot\public Output: ================ Error Output: ================ 'node' is not recognized as an internal or external command, operable program or batch file.