Up next in 10
Responsively App — “Responsively—Open Source Dev Browser Preview All Devices Side by Side in Seconds
Aug 18, 2025
Get the full source code of application here:
Show More Show Less View Video Transcript
0:00
Uh hey guys, welcome to this video. So
0:01
in this video, I'll show you a tool for
0:03
web developers and programmers for
0:05
crafting your web applications. Uh this
0:08
is a development tools. Uh you can say
0:11
it's an IDE similar to VS Code. But uh
0:14
it's specifically designed for designing
0:16
websites and you can preview your
0:18
website in different screen sizes at
0:20
once, mobile, laptop or tablet. As you
0:24
can see, mirrored interactions, quick
0:26
context switch. So it's a very good
0:29
development tool and the nice thing is
0:31
that it's completely open source and
0:33
this is the website responsibly.app.
0:37
So if you enter this inside the browser
0:39
this landing page will come. As you can
0:41
see it's available on GitHub. It's got
0:43
almost 24,000 stars.
0:46
This is their GitHub repo right here. A
0:49
modified web browser that helps in
0:51
responsive web development. A web
0:53
developers must have. So it's kind of a
0:55
browser
0:57
similar to Google Chrome but it's
0:59
specifically designed to check out your
1:02
application. So if you click download
1:04
now it's available for all the operating
1:06
systems. It's an crossplatform solution.
1:09
So I'm on Windows. So I will download
1:12
the Windows exe file. So it is just
1:15
downloading. So just wait.
1:22
So once it is installed, you basically
1:24
run the .exe file.
1:45
So now the browser will launch right
1:47
here guys. You can see that. So you can
1:49
preview your website in any screen size.
1:52
So this is iPhone 12, this is iPad, this
1:55
is MacBook Pro. So you can visit any of
1:58
your favorite website or any application
2:01
you make. You can simply type the URL
2:03
and now the application will load right
2:05
here. You can see it's a desktop
2:08
application. So it is loading your
2:09
website in mobile device.
2:13
And this is your tablet view.
2:16
And this is your MacBook Pro. So right
2:18
here uh you can take a screenshot full
2:21
page screenshot. If you click the
2:24
screenshot will be taken and it will be
2:26
saved inside your machine. So you can
2:28
see that automatically
2:30
you can take screenshot as well of a
2:32
complete website. So it's a very useful
2:35
development tool for programmers and
2:37
developers. So if you're looking forward
2:39
for this, you can definitely install it
2:41
totally free. There is no restriction
2:43
that how much you can use it. It's
2:45
totally free for you. You can toggle the
2:48
dark theme as well. So,
2:51
it's a great development tool, debugger
2:54
tool as well.
2:57
So, you can even open the development
2:59
tools right here. Click the open dev
3:01
tools and you can check out the console
3:03
as well. So, it's very
3:06
easy tool for troubleshooting. Apart
3:08
from that also it has various option.
3:11
Show rules as well, screen ruler. You
3:14
can rotate the device as well.
3:18
So,
3:22
so definitely try this guys. And uh by
3:26
default in Chrome there is no
3:27
functionality to actually preview
3:28
devices and uh different screen sizes.
3:31
We need to install extensions for that.
3:33
But this is a tool specifically made for
3:36
responsibly app.
3:38
And you can basically open any website
3:40
here.
3:46
So you can see that. So
3:54
you can even say individual layout. So
3:56
you can basically see this in mobile
3:58
devices. You can check out all the
4:00
links.
4:04
So you can switch to like this as well.
4:06
So this is on iPad like this.
4:09
MacBook Pro.
4:14
This is in various screen sizes as you
4:17
can see right here.
4:23
So definitely try this uh uh desktop
4:27
software guys. Responsively app it is
4:29
called. It's completely free opensource.
4:32
So definitely try
#Web Design & Development
#Development Tools
#Open Source