Skip to content

btansy/CSV_Report_Generator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 

Repository files navigation

README

Basic Requirements
Use Express to build a client-server app that generates CSV reports from JSON data.

The JSON->CSV conversion specification is:

The server must flatten the JSON hierarchy, mapping each item/object in the JSON to a single line of CSV report (see included sample output), where the keys of the JSON objects will be the columns of the CSV report.
You may assume the JSON data has a regular structure and hierarchy (see included sample file). In other words, all sibling records at a particular level of the hierarchy will have the same set of properties, but child objects might not contain the same properties. In all cases, every property you encounter must be present in the final CSV output.
You may also assume that child records in the JSON will always be in a property called `children`.

  Use Express to serve up an index.html file and its associated assets
  The client app should be able to submit JSON data to the server, receive a response containing a CSV-formatted result (the way this is done will vary depending on where you are in the challenge).
  Implement all the report generation logic on the server. Do not use any external libraries (such as via npm). You may use jQuery on the client.
  
Build your Express app inside server.js and your client app inside the client folder. Don't forget to create a package.json to store your project's dependencies.

Initially, submission of the JSON data (from the client to server) should be done using an HTML form with a single textarea input field (for the entire JSON text) and a submit button. When the user clicks submit, POST the form data to the server. The form submission process should use the default browser action/behavior. DO NOT use jQuery/AJAX functions in the submission process.

The response from the server should contain the CSV report along with the form so the user can keep submitting indefinitely, without having to go back to the "form page". DO NOT USE jQuery/AJAX. You may use the supplied examples of JSON and CSV for testing and verification.

Now that you have basic client/server submission working, refactor your form to use a file picker instead of a textarea. Continue to use the browser's default action. DO NOT USE jQuery/AJAX.

Next, refactor to a single page application by using jQuery/AJAX to submit your JSON file to the server using AJAX. Note: a single page app means that once the page loads, no user-generated actions on the page may cause the entire page to reload. You will know the page is reloading if you see a change in your URL. You must prevent this behavior from occurring.

Lastly, add a link to download the most recently created CSV report. You can choose to make this a server-based or client-based action.

You are allowed to use jQuery to manipulate the DOM and handle any DOM events. You may use jQuery/Ajax only when you get to the step in the basic requirements that asks you to do so. For ease of development, be sure to use nodemon to watch for changes in your project. Additionally, no CSS styling is necessary. Use the browser's default styling for all elements on your page.

Use the coding best practices you learned previously to ensure a clear separation of concerns with well-defined interfaces.

If you get stuck or are not sure how to proceed, you may look at the hints file for this challenge to help you along.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors