Nexus

The most advanced Framework for developing applications of any complexity: from SaaS platforms to modern mobile applications in weeks, not months

2024 Nexus Framework
Made by Podolchak.agency
Enterprice version 1.2.0

Based on

The performance that is required now

With Node on the server side and Vue on the client side, we have created a one-of-a-kind end-to-end container solution that is easily scalable and meets all the modern requirements of F-500 companies

Packages Installed

Authentication

User authentication and Log in check middleware

Path: /components/example/Auth.vue

Store: /store/auth.ts

Middleware: /middleware/auth.js

Plugin: /plugins/client.js

Authentication is done through Directus API, it can also be added through SSO. After authentication the token is updated automatically and SSR takes data from the cookie. All other mechanics such as automatic token update are performed in the background. For the convenience of using authenticated requests, a plugin directus was made, which allows using already created authenticated client. All additional options for use are outlined in the documentation.

Documentation

Please Log in

Modules Installed

Swiper - Hero Slider

The best hero slider with flexible configuration and good documentation

Path: /components/example/Swiper.vue

A very elaborate slider that works great on all devices and has very good documentation.

View examples: https://swiperjs.com/demos

Documentation

Awsome Slide #1

Awsome description for awsome slide

Awsome Slide #2

Awsome description for awsome slide

Awsome Slide #3

Awsome description for awsome slide

Awsome Slide #4

Awsome description for awsome slide

Awsome Slide #5

Awsome description for awsome slide

Awsome Slide #6

Awsome description for awsome slide

Awsome Slide #7

Awsome description for awsome slide

Awsome Slide #8

Awsome description for awsome slide

Awsome Slide #9

Awsome description for awsome slide

Awsome Slide #10

Awsome description for awsome slide

Kinesis

Simply the best animation engine

Path: /components/example/Kinesis.vue

Kinesis is easy to use component for interactive animations. On the /plugins/kinesis.js path you will find everything about registering a component in the application.

Move the mouse over the interactive block to see the effect

Documentation

Move your mouse

Some awsome card

GSAP Animation Engine

Simply the best animation engine

Path: /components/example/Gsap.vue

By following the link https://greensock.com/docs/v3/Plugins you can find many useful plugins and install them by modifying /plugins/gsap.js which also contains examples of how to do this. Gsap needs to be rendered on the client side, so everything associated with it should be wrapped in the following construction onMounted(() => {...})

This example has everything you need to deal with: animation, interaction, animation when scrolling. The example also includes actions using basic callbacks.

Documentation

Click and pull

0

Motion Utilities VueUse

Path: /components/example/Motion.vue

Best way to add fade in animation on scroll or other events. All items have iVisible trigger effect and 2-4 have also hover effect

Documentation
1
2
3
4

Interactive Utilities VueUse

Path: /components/example/Gesture.vue

Slide your cursor over the example block and you will see a circle that follows the pointer, taking into account the speed and trajectory. In fact, the capabilities of the plugin itself are much more, it supports: Drag, Move, Hover, Scroll, Wheel, Pinch and perfectly plays with Motion

Documentation

Move your mouse

Dropzone

Path: /components/example/Dropzone.vue

Plugin: /plugins/client.js

This example allows you to quickly create a component that allows you to upload files via API. In order for the example to work, you need to allow everyone to upload files or authorize if the authentication package is installed.

Documentation

Upload file

Drag and drop files here or click to browse

Max File Size: 5 MB