What is AlertifyJS
AlertifyJS is a javascript framework used for developing browser dialogs and notifications that are completely pre-designed. Unlike Bootstrap, AlertifyJS is extensible, themeable, and easy to use. You don’t have to worry about HTML and CSS. AlertifyJS will do that just for you!
Features
Usage
Currently, AlertifyJS is offering v1.12.0. If you are looking for a commercial license and want to support the developers of this framework, they also provide that for only $19.
If you prefer to use CDN, then you may copy the following code.
Keep in mind though that you only need alertify.min.js
, alertify.min.css
, and default.min.css
or any theme CSS file you prefer.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/alertifyjs@1.12.0/build/alertify.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.12.0/build/css/alertify.min.css"/>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.12.0/build/css/themes/default.min.css"/>
</head>
<body>
</body>
<script>
alertify.alert("Hello World!");
</script>
</html>
Code language: HTML, XML (xml)
Whenever you use JavaScript frameworks, it is important to always include jQuery since most frameworks rely on jQuery.
Now, it’s pretty simple? Right?
With just a few steps, you’ll be able to step up your browser dialog.
Pros and Cons
Using AlertifyJS is very easy and it will make your browser dialogs more user-friendly and browser-friendly. These are the pros that you could expect from this framework.
The only disadvantage that we can see from this framework is that it would increase your file requests. As you can see, to make everything work, you are required to pull three files.
You may think it’s not too much but it is our responsibility to make the request as small as possible for the user’s experience.
Now, you might be thinking…
Is there any way to solve this issue?
Of course! And that is to optimize the files.
You can compress these files into 2 files, one CSS and one JavaScript.
So, let’s say you have style.css and you have alertify.min.css
and default.min.css
or whatever theme you choose. You can just compile these stylesheets into one file. That way you would save two files!
Same goes with javascript files. If you have script.js
, you can just insert the content of alertify.js
into your script. Just don’t mix jQuery and alertify.
Post a Comment
0Comments