Build a SCREENSHOT App with Node & Vue JS | Puppeteer JS

Learn how to build a screenshot tool to take screenshots of websites using NodeJS with the puppeteer dependency and then use VueJS to build the client side frontend.
// JOIN THE NEW DISCORD SERVER!
/ discord
// FOLLOW ME ON TWITTER
/ tyler_potts_
All of these products I own and have tested!
// INTERESTED IN GAME DEV?
Game development channel: / muddywolf
// CHECK OUT MY GAME
play.google.co...
// DO THESE SIMPLE STEPS
LIKE, SUBSCRIBE & SHARE

[@parthteli9039]

Following you from 2 years ! And I have build every single project of Reactjs and Vuejs ! Because of you I got the company which I was working for ♥️ Thank you so much Tyler 😄

[@TylerPotts]

That's great! I'm happy to hear that!!! :D

[@АлишерАзимов-д8ш]

so cool video, thank you. I will wait for your next video on vue :)

[@TylerPotts]

More to come!

[@reblin8692]

Finally another great tutorial from one of the best tutorial creators, thanks🙏

[@TylerPotts]

Wow, thanks!

[@S042069]

Great video! Thank you for sharing. Was wondering if it can take batch of URLs

[@shivap6094]

I'm getting the screenshot but it's taking the screenshot before page completely loads. So, I'm just getting "loading...". What should I do?

[@ikshvakugarg3154]

really like your content

[@TylerPotts]

Thank you! :D

[@SACHINDHOTE10]

I copied exact code from video but it’s not working. Actually I am working on a project where user input his user ID from frontend and then puppeteer code provides the output based on the user input. Currently there is no video on KZbin which can walk us through this, even stack overflow is having broken links regarding this project.

[@RodrigoDAgostino]

Thank you very much, Tyler! This has been a really helpful tutorial :) I managed to had several additional parameters like width, height, file type, file quality and capture delay, but now I’m having an issue since I’m pretty new to Node.js and Express and I don’t really know how to solve it. How can we handle the download so a dialog opens up to save the file instead of having the image be opened in a new tab?

[@programmerrdai]

Great Content keep up the good work :)

[@TylerPotts]

Thanks, will do!

[@iambasanta]

will you make a video , describing css part of your new portfolio website? Please ...

[@technoschool3351]

Sir how to take screenshot of whole window can you please help....

[@dice9519]

How can I deploy this on my Github Instructor Tyler Potts?

[@israndquinta2500]

How could I save cookies? so the screenshots come clear

[@pecandubisnis]

Hi, i love this video. Just liked & subscribe it. And im just wondering is it possible to build for task automation instead of scraping? Im trying to learn to build node js puppeteer automation that has GUI to ease users to use it If so, i would be happy & much appreciate if you would make a tutorial video for it. Thanks in advance

[@DuNguyenDuy-qw3hm]

please tell me can this app actually run on the server, thanks

[@gamercat4878]

It's work on long pages too?

[@TylerPotts]

If you want to screenshot the full page you can pass the option into the screenshot function called "fullPage: true"

[@gamercat4878]

@@TylerPotts wow thanks I'll try

[@OlegMalij]

It doesn’t work with very long pages, you will get a blank space at the bottom. But in general this approach is really good.

[@mayaralbatal]

Yooo

[@TylerPotts]

Yooooo