0:00
Uh hey guys welcome to this video. So in
0:02
this video I'll show you a view Canva
0:04
clone that I developed in my website. It
0:07
is also deployed this I've given the
0:09
demo link in the description of the
0:11
video. So once you go to this the
0:13
interface looks like similar to Canva
0:16
and it's developed using Vue.js
0:18
TypeScript and we have also used third
0:20
party dependencies. So if you go to the
0:22
menu section we have a bunch of
0:23
templates that you can one click you can
0:26
edit. We also have different shapes. You
0:29
can even create multiple pages as well.
0:31
And you can add your own text as well.
0:34
Just add this to the canvas. We also
0:36
have support for adding your custom
0:40
Just add this to the canvas. So I have
0:42
given the link. You can directly
0:43
purchase the source code of this. So
0:45
after purchasing it, you will be getting
0:47
the source code from Google Drive
0:49
automatically. So we have used these
0:51
third party dependencies HTML to canvas,
0:54
JSP, PDF and fabric.js.
0:56
and we have used the latest version of
0:58
Vue. So once you get the source code,
1:01
it's very simple to run it locally. Uh
1:04
first of all execute npmi and then npm
1:08
rundev. So this will start this project
1:11
locally at localhost 5174.
1:17
so now this will automatically open your
1:19
application. Before purchasing it, you
1:22
can try it out. I have given the demo
1:23
link in the description of the video and
1:26
uh here you can one click change the
1:28
background and then we can export this
1:30
to a image file. You can just select the
1:33
extension click on whatever extension
1:35
and then similarly we can even export
1:38
this to a PDF file as well. So now if
1:41
you open all the pages will be exported
1:43
to PDF file here you can see that. So
1:46
this is an ultimate Canva clone editor
1:48
having all the features of Canva. You
1:51
can directly purchase it. The link is
1:53
given in the description.
1:56
You can even resize it if you are
2:00
just give it a custom resize or you can
2:04
if you're building it for various social
2:06
media networks with a single click you
2:08
can actually resize it as well. So
2:13
all the actual components are having its
2:17
own Vue.js files here.
2:21
If you see Vue.js files are there. So if
2:24
you know the source code, you will
2:26
definitely be able to modify the source
2:27
code as well. So it's also coded inside
2:33
So this is the overall project structure
2:36
and first of all you can try out the
2:38
application and then after that you can
2:40
purchase the source code as well if you
2:45
So it has all these. You can have all
2:48
the text effects. You can even align the
2:52
position, rotate the text, everything
2:54
you can do which Canva supports here.
2:58
Can control the transparency and then
3:00
you can align it however you like. It
3:03
has having different layers as well. So
3:07
it's a layerbased editor.
3:10
So as you can see it has started this at
3:14
It's really easy to run it locally and
3:17
also deploy it as well. So definitely