Explore

F23 Mad 6135 Course Project

Expectations which should be delivered in your Project:

Code (TS Objects) / and Data Store:

ShoppingCart Object:

User

Array of Product added to ShoppingCart

User OBJECT:

UserName

UserEmail

Catalog OBJECT:

Some data structure (an Array will do) to store OBJECTS corresponding to the items in your Catalog

On Application Startup: have a method to iterate over the Data Records in your Database, and object representations of them. During User Interactions: user interactions: Interact with the OBJECTS: Have a proper shutdown procedure for your App: Iterate over the Objects in the Catalog array and do sql update to update the sql records in the database.

We are here to learn Node.js Application Development: Make sure your project is formulated as a proper Node.js Project:

To create a Node.js Application:

Make a Directory: Create a package.json which the configuration file for your Project by doing

npm -init

When ready to submit the project, do npm -publish: npm -pubish done by each team member: Give me in your

npmjs.com⁠

LINK I will test the project by doing npm -i <your provided link>

What about your data store? I am assuming most teams are using SQLite as the Data Store: Make a Zip file of your Porject DIrectory. Upload that zip file into your GITHUB. Provide the Git Hub URL in a card in your TRELL Board. <your GitHUB URL which will be in a Card in your Trello Board>.

Expectations of the Project

Your Trello Board will include:

Your GItHub Code repository URL.

Your GitBook documentation URL:

Documentation should include a description of your project architecture, your data store architecture, and the Business Rules which you are implementing with your TypeScript Business Objects.

Your project is to deliver a Full Stack Node.js web application on some business or activity theme of your own interest.

You site should include: static midddleware, template language, and form processing which includes TS Business Objects and interaction with your Data Store. Also: Your Project should be visually appealling and should include CSS and Static Images.

Have a DATA STORE (SQL, MongoDB, or Firebase)

Provide a FRONT END EXPRESS SERVER WITH SOME FORMS

I should the use of static middleware for images, css.

Also - I should see TEMPLATING Language: You provide html templates: in the Template you have string substition tokens, which the templating engine subsitutes to the equivalently name data variables at runtime, for example: {custlastname}

Your HTML form (which will be in the templating language template) will use AJAX to deliver to the server-side node js program, in JSON format, the collection of fields and their data values, the user provided input to send to the server. When user clicks SUBMIT button, you form will send those field name/ value pairs to the appropriately named route in your express js program. This will trigger logic in your server-side node.js program, to deliver some business rule, and push some response back to the Browser.

IMPLEMENT a Controller Partition of your Model View Controller Full Stack Node.js Website. Have a Controller SOME TYPESCRIPT OBJECTS TO BE THE CONTROLLER: These typescript OBJECTs will be the Business OBJECTS to maintain the data state of your application. Example : you keep track of customer purchases with ARRAYS of record data pulled out of the Database corresponding to sql pulls based on user format data. You can then Loop over your TS Business Objects which are in an array and sum up the prices to present back with res object in the Browser the user’s total bill of their purchases.

TO DO:

I will demonstrate creating my own project and show more examples of Templating Language files.

How to get started on the Project: 4 members per team

Make a TEAM TRELLO BOARD

URL of TELLO board,

peter@petersigurdson.net⁠

is a member of.

Swimlane: one card per member, Team name

Make

peter@petersigurdson.net⁠

a member

Upload a text file named as TeamName.txt with team members: email, studentID, and, team name, and trello board link to

⁠

https://www.dropbox.com/request/CkuJxvSKMeM7soQLzIXe⁠

⁠

Project VIDEO:

https://app.knowmia.com/PQWW⁠

⁠

Hand in work for the Project:

One hand in for the team:

GITBOOK URL for documentation

TRELLO Board LINK

GITHUB (link in Trello Board)

Datastore.

Project LINK on

NPMJS.com⁠

{Each team member does this by themselves}.

⁠

NPM Application Development lecture:

⁠

How to get started on the Project: 4 members per team

Make a TEAM TRELLO BOARD

URL of TELLO board,

peter@petersigurdson.net⁠

is a member of.

Swimlane: one card per member, Team name

Make

peter@petersigurdson.net⁠

a member

Upload a text file named as TeamName.txt with team members: email, studentID, and, team name, and trello board link to

Hand In requirements for your Project:

You will do npm -publish to upload to

NPMJS.co⁠

m your Project.

Just as for Express.js : npm i <your project name>

*** In this course you will learn

(1) JavaScript

(2) Node and NPM application development

You will can Firebase as your Cloud Store for your Application:

Or SQLite on local server

Or JSON file as we did for the JOKES API lab

You will make an MVC patterned Web Application View : express.js POI

Model:

FIREBASE : cloud-based data store

or a local sqlite DB

or a local JSON file

Controller: TYPESCRIPT, OO JavaScript

Your Team Trello Board will be part of your Project Submission.

Your Team GitHub Repository.

Your Team’s GitBook markdown Documentation will be part of your Handin.

For your JavaScript course project, you can work in teams of up to 4 members.(or 2, 3, or just you)

You are expected to incorporate the concepts we learned in the Software Testing and Software Quality Engineering Class.

You are expected to present a Project Plan to prescribe the development of your Project, and a Software Build Plan.

You will use a Trello Board to organize your Team Collaboration.

You will present a final documentation of your Product using Markdown and GitBook.

Your deliverable will be a full stack web application demonstrating the operation of the three tier Model View Controller Design Pattern.

The front end will be an HTTP Web Server implemented with Node.js Express and html forms.

The back end will be a data storage which you can implement as a Firebase Database, SQLite local database or a local JSON file.

Your controller will be implemented as TypeScript objects to implement the business rules and algorithms of your application.

For this project, you're expected to use the material that you learned in software testing, as well as unified process to do a unified process methodology design and implementation of your Project..

A typical example might be an E commerce web store where you will have some products in your data store. I will demostrate building Peter’s Mensware Emporium.

Some HTML forms on your front end, and user will interact with your web forms.

⁠

https://coda.io/@peter-sigurdson/creating-an-interactive-web-form-with-node-js-ajax-services⁠

Your website will be of the format of full Stack Node.js Application in which you will have a database and the back end storing your product catalog which will include photographs and descriptions of the product.

You will have a front end which will be an HTML page served up by your Express server and you will have a middle controller partition which will be JavaScript objects that transact between the front end and the back end and implement the business rules of your E commerce application.

Work Breakdown Structure:

September 26:

done: Start to learn Express.js as a Node.js Framework to build a webserver.

done: TypeScript: OO JavaScript: Used in the Controller Partition.

⁠

https://www.npmjs.com/package/express⁠

⁠

npm init

npm i express

⁠

How to your Full Stack Web Application:

⁠

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.