PART A

EXPERIMENT NO. 9
Experiment 9
A.1 Aim: Coding for any one module of your project selected according to the designs
which already designed and analyzed in EXP.1-6
A.2 Prerequisite:
Use case diagram, class diagram, State diagram
A.3 Outcome:
Coding of a module with less errors
A.4 Theory:
The coding depends on individual’s project. Any programming language can be used
according to student’s interest.

Coding : The objective of the coding phase is to transform the design of a system into code in
a high-level language and then to unit test this code. Good software development
organizations normally require their programmers to adhere to some well-defined and
standard style of coding called coding standards.

Coding Standards- A coding standard gives a uniform appearance to the codes written by
different engineers. It enhances code understanding. It encourages good programming
practices.

Coding Standards and Guideline:

Limiting the use of global data type. Contents of the headers preceding codes for different
modules naming conventions for global variables, local variables, and constant identifiers.
Error return conventions and exception handling mechanisms Representative Coding
Standards. Do not use a coding style that is too clever or too difficult to understand. Avoid
obscure side effects .Do not use an identifier for multiple purposes. The code should be well-
documented.

Code Review:

Code review for a model is carried out after the module is successfully compiled and all the
syntax errors have been eliminated. Normally, two types of reviews are carried out on the
code of a module.

Code Walk Through: To discover the algorithm and logical errors in the code.

Code Inspection: The aim of code inspection is to discover some common types of errors
caused due to oversight and improper programming.
Software Documentation:Good documents are very useful and serves the following purposes.
Good documents enhance understandability and maintainability of a software product. It
helps the users in effectively using the system. Helps in effectively handling the manpower
turnover problem. Helps the manager in effectively tracking the progress of the project.
Software Documentation classified into the following: Internal documentation: These are
provided in the source code itself
External documentation: These are the supporting documents that usually accompany a
software product

**********************
 PART B
(PART B: TO BE COMPLETED BY STUDENTS)
(Students must submit the soft copy as per the following segments within two hours of the
practicals. The soft copy must be uploaded on Blackboard LMS or emailed to the concerned
Lab in charge Faculties at the end of practical; in case Blackboard is not accessible)

Roll No: E026 Name: Shubham Tana

Class: B.Tech CSBS Batch: 1

Date of Experiment: Date of Submission:

Grade:

Exp-9

Github link to the whole code - https://github.com/Nisarg2061/KGNS_Final

Code –
App.py –
from flask import render_template, jsonify, request
from flask import Flask
from config import app, db
from models import Vendors,Bill

@app.route("/")
def home():
return "Welcome to our API"

@app.route("/vendors", methods=["GET"])
def load_vendors():
vendor = Vendors.query.all()
json_vendors = list(map(lambda x: x.to_json(), vendor))
 return jsonify({"vendor" : json_vendors})

@app.route("/vendors/add", methods=["POST"])
def add_vendor():
Name = request.json.get("name")
Email = request.json.get("email")
Mobile = request.json.get("mobile")
if not Name or not Email:
return (
jsonify({"message":"You must enter both"}),
400,
)

new_vendor = Vendors(name=Name, email=Email, mobile=Mobile)

try:
db.session.add(new_vendor)
db.session.commit()
except Exception as e:
return jsonify({"Message":str(e)}), 400

return jsonify({"Message" : "New Vendor added!"}), 201

@app.route("/vendors/edit/<int:user_id>", methods=["PATCH"])
def edit_vendor(user_id):
vendor = Vendors.query.get(user_id)

if not vendor:
return jsonify({"Message":"Vendor id not found!"}), 404
 data = request.json
vendor.Name = data.get("name", vendor.Name)
vendor.Email = data.get("email", vendor.Email)
vendor.Mobile = data.get("mobile", vendor.Mobile)

db.session.commit()
return jsonify({"Message" : "Vendor details updated!"}), 200

@app.route("/vendor/delete_vendor/<int:user_id>" , methods=["DELETE"])
def delete_vendor(user_id):
vendor = Vendors.query.get(user_id)

if not vendor:
return jsonify({"Message":"Vendor id not found!"}), 404

db.session.delete(vendor)
db.session.commit()

return jsonify({"Message" : "Vendor Deleted!"}), 200

@app.route("/bills", methods=["GET"])
def load_bills():
bills = Bill.query.all()
json_bills = [bill.to_json() for bill in bills]
return jsonify({"bills": json_bills})

@app.route("/bills/add", methods=["POST"])
def add_bill():
data = request.json
 description = data.get("description")
hsn_sac = data.get("hsn_sac")
gst_rate = data.get("gst_rate")
quantity = data.get("quantity")
rate = data.get("rate")
unit = data.get("unit")

# if not all([description, hsn_sac, gst_rate, quantity, rate, unit]):

# return jsonify({"message": "All fields are required"}), 400

new_bill = Bill(
description=description,
hsn_sac=hsn_sac,
gst_rate=gst_rate,
quantity=quantity,
rate=rate,
unit=unit
)

db.session.add(new_bill)
db.session.commit()

return jsonify({"message": "New bill added!"}), 201

if __name__=="__main__":
with app.app_context():
db.create_all()
 app.run(debug=True)

frontend –
import Header from "../components/header";
import { useEffect, useState } from 'react';
import Footer from "../components/footer";
import VendorList from './vendorlist';
import VendorForm from './vendorform';

export default function Vendors() {

const [vendor, setVendor] = useState([{}])
const [isModalOpen, setIsModalOpen] = useState(false)
const [currentVendor, setCurrentVendor] = useState({})

useEffect(() => {
fetchVendor()
}, []);

const fetchVendor = async () => {

const response = await fetch("http://127.0.0.1:5000/vendors")
const data = await response.json()
setVendor(data.vendor)
console.log(data.vendor)
}
const closeModal = () => {
setIsModalOpen(false)
setCurrentVendor({})
 }

const openCreateModal = () => {

if (!isModalOpen) setIsModalOpen(true)
}

const openEditModal = (vendor) => {

if (isModalOpen) return
setCurrentVendor(vendor)
setIsModalOpen(true)
}
const onUpdate = () => {
closeModal()
fetchVendor()
}

return (
<>
<Header/>
<VendorList vendor={vendor} updateVendor={openEditModal}
updateCallback={onUpdate}/>
<br />
<button onClick={openCreateModal}>Add New Vendor</button>
{ isModalOpen && <div className="modal">
<div className="modal_content">
<span className="close" onClick={closeModal}>&times;</span>
<VendorForm existingVendor={currentVendor}
updateCallback={onUpdate}/>
</div>
</div>
 }

<Footer/>
</>
)
}

OUTPUT
B.1 Conclusion
Understood the following things –
1. How to use flask to make an api server in python
2. How to use react to create a frontend to use all the api
3. How to use github for version control and team colaborations