Developers Guide

Setting Up Development Environment

To make changes in the existing app you need to setup a dev environment.

Lets discuss the required tools and libraries to setup your dev machine.

  • Node js >= 12
  • Laravel 8
  • Typescript 4.6.2
  • Vue js > 3.0
  • PHP >= 7.4
  • Xampp Server
  • Prime vue > 3

Lets start with the Node Js installation. Node js is mainly required for its package manager npm. To download node js link below and the platform we are using for this dev environment is for Windows. 

https://nodejs.org/en/download/

After Node lets download the xampp server from apache. Make sure to download PHP version >= 7.4 for Windows platform.

https://www.apachefriends.org/download.html

Install both xampp and Node after downloading it. To verify that node installed correctly on your machine open command prompt and type node -v to verify its installed correctly.

node -v

You will be able to see the node version if everything is installed correctly.

For the front end design of the app we have used Prime vue.You can learn more about the components and UI we used in this app from prime vue site. 

https://www.primefaces.org/primevue/setup

For the backend APIs we have used Laravel 8 .Visit Laravel to learn more about it.

https://laravel.com/

Navigate into xampp directory inside xampp/htdocs.Create a new folder name pos inside htdocs dir.

Copy the source code from source_code folder that you downloaded from Envato to the pos directory of htdocs.

Open your xampp control panel and start apache and mysql

VS Code Spantik Lab

Open a new tab and create a new database in phpmyadmin name medix_v4

localhost/phpmyadmin
phpmyadmin_medix

Open the pos folder to any text editor or IDE. In our case we are using VS Code.Open a terminal in vs code and run this command 

npm install
vs-code-spantik-lab

npm install will download all the required packages from npm registry.The list of packages it will download are listed on package.json file.

After installing all the required package now run:

php artisan serve

The above command will start backend services to listen from frontend.

Now start serving the frontend site by type below command in vs code terminal.

npm run watch

Open a new tab on your browser and type :

localhost:8000

If everything is good you will be able to see the installation page on your screen.

To learn more about php artisan command visit laravel.com