#80 Laravel setup on Windows systems.
One of the best scalable and flexible back-end frameworks for PHP is the Laravel system. This system offers user front-end and an admin panel, APIs can also be written with authentication and many so called “blade” templates are available for purchase or you can make your own front-end.
The walk-through setup files and README.md documentation is available on my GitHub here.
Live2D is also the name of an eponymous animation software series employing the technique and the software’ developer company, created by Japanese programmer Tetsuya Nakajo.
The software, and its underlying technique, enable users to animate their illustration by providing an illustration prepared in layered parts that constitute the original illustration, such as its eyes, mouth and arms, and stitch the parts on a skeleton to generate animation. The Live2D Ltd. provides the software and SDKs under commercial licenses and for free.
Live2D has been used in a wide variety of video games, visual novels, virtual YouTuber shows, and other software. Well known examples includes FaceRig, Nekopara, Azur Lane,and Tsukino Mito [ja], a virtual avatar and YouTube celebrity from Nijisanji [ja]’s facial motion capture app.
Tabulator is an easy to use, fully featured, interactive table JavaScript library.
Tabulator allows you to create interactive tables in seconds from any HTML Table, JavaScript Array, AJAX data source or JSON formatted data.
Simply include the library in your project and you’re ready to roll.
Tabulator has an enormous number of features to help customize your table experience to your needs.
With new features released every month, there is bound to be something to get your interactive table juices flowing.
A detailed breakdown of all of the available features can be found in the Documentation.
This is a web gallery in one single PHP file. All you have to do is copy the script to any directory containing images to make a gallery. Sub directories will be sub galleries. Thumbnails for images and directories are generated automatically.
Single File PHP Gallery does not require any configuration and is very easy to use and modify.
Google Charts allows us to display big data in a visually appealing way. Google offers animation and lots of other options to modify google charts. The charts are rendered using HTML5/SVG technology and the charts themselves are exposed as JavaScript classes In this example five different charts are drawn and are refreshed every time the page is resized using a simple line in JavaScript:
window.onresize = function(){ location.reload();}
On page resize the page is refreshed. Since we are using the charts inside HTML iFrames this works quite well.
JALERT is a useful library which can be used to replace the three boring system kinds of popup boxes: Alert box, Confirm box, and Prompt box.
The usual system JavaScript alert would be called like below:
alert("I am an alert box!");
Jalert can be used in the same way but with more functionality:
|
1 2 3 4 5 |
$("#confirm_button").click( function() { jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) { jAlert('Confirmed: ' + r, 'Confirmation Results'); }); }); |
Beautiful circles are formed while the mouse is moving inside your browser. This short bit of code uses the D3.js library also known as the Data Driven Documents JavaScript library.
D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.
D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. For example, you can use D3 to generate an HTML table from an array of numbers. Or, use the same data to create an interactive SVG bar chart with smooth transitions and interaction.
In this case D3 was used to display colorful circular animations behind the mouse while it moves over the browser window.
Take a look at the EXAMPLE GALLERY for more examples.
These are the top 5 free web templates (May 8th 2020) in my opinion. There is millions if not billions of options out there however these are just a few that I have had experience with. They are generally easy to use and modify.
Kapella-Free-Bootstrap-Admin-Template
The following is a few examples of web loading animations made entirely in HTML and CSS. jQuery is used to add and remove the CSS animations. For example once the document has loaded a jQuery click event can be triggered like so:
|
1 |
<strong> jQuery(document).ready(function (${ $('#pulse').click(function({ $('.placeholder').removeClass('wave').addClass('pulse'); }) });</strong> |
index.php shows a variety of different shapes combined. The following 3 small scripts show their respective shapes. anim.css holds all the animations.
HTML: Hyper Text Markup Language
jQuery: lightweight JavaScript library
C# Winforms .NET Application
Using visual studio 2019
For the red DropShadow class
https://github.com/wenerme/winform.DropShadow
XanderUI for the buttons progress circle etc.
https://github.com/Ricky310711/XanderUI
can also be added via NUGET.
librarys needed:
-XanderUI
The solution is divided into 3 different folders: Classes, Forms and Icons. The Classes folder only contains one class which allows us to drag the form.
The Forms folder contains all the forms for the short project. these forms are all overlaid on the Dropshadow.cs form which is the faded red outline around each of the forms.
The Icons folder holds all the custom icons used in this project. Most of the icons used are packed into an imagelist component used by visual studio, however some are just pictureboxes that were added the good old fashioned way.
This project is purely visual, there is no back end logic whatsoever, It’s based on the Umbrella corporations logo fro the resident evil series.
When the login button is clicked an event is triggered initiating a 5 second timer. This is to simulate the authentication process which would be occurring if the application was in fact communicating to a server out there in the ether.
Some Tips:
– Set the image list color depth to 32 bits so the best quality can be leveraged.
-Search NUGET for an easy download of the XanderUI dll.
-Restore NUGET packages and clean + rebuild the solution often.
DOWNLOAD SOURCE CODE HERE