Git Product home page Git Product logo

tchestnut85 / team-builder Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 1.0 266 KB

A team profile generator which uses Node.js, Inquirer.js and Jest (for test-driven development). Inquirer prompts questions in the command line and the user's answers populate the HTML code to create a team profile webpage.

Home Page: http://bit.ly/teambuilder-tc

License: MIT License

JavaScript 75.61% CSS 1.46% HTML 22.93%
inquirerjs jest javascript template-builder object-oriented-programming test-driven-development node-js

team-builder's Introduction

Team Builder

License

Description

Team Builder is a team profile generator that you can quickly create an HTML file with cards for each of your employees which include their emails and GitHub profiles. This app uses Node.js, as well as Inquirer to prompt questions in the command line which. Jest was also used for Test Driven Development. After going through the series of questions for your employees, an HTML file will be generated in the dist folder as well as an assets folder containing a CSS file.

Team Builder questions and answers example:

Questions and Answers

HTML Webpage generated from answers:

Questions and Answers

Table of Contents

Installation

  • Make sure Node.js is installed on your computer.
  • Clone or download the repository from GitHub.
  • In the terminal, navigate to Team Builder's directory and install the required modules by running npm install.
  • Run npm start to execute the app.

Usage

This app can be used to quickly create a team profile webpage for easy access to your team's important info, email and GitHub profiles. After completing the series of questions, you will have a new HTML file that you can open in your web browser.

  • You will be prompted with a series of questions about the manager and additional employees.
  • The question types used include text input, yes/no questions and a list. Type in text input answers, use the up/down arrows for the list then enter to select the answer, and y/n then enter for the yes/no questions.
  • Once all the questions have been answered, your answers will print to the terminal and a confirmation will also appear in the terminal that your HTML file has been generated.
  • A new HTML file named index.html will be created in the /dist directory along with a style.css file in the /assets/style directory.
  • Open the index.html in your web browser to view the generated webpage.
  • If moving the index.html and the style.css files to another directory, make sure to move both the index.html and /assets directory because the CSS file in there is needed for the index.html file.

Contributing

If you would like to contribute to this app, please contact me by email listed below.

Questions

Please visit my GitHub profile to check out this and other projects I've created and contributed to. If you have any specific questions about this project, please contact me at [email protected].

Links

  • Click here to visit this project's GitHub repo.
  • View a walkthrough video here.
  • See a sample README generated from the app here.

License

License

This app is licensed under the MIT license.

team-builder's People

Contributors

tchestnut85 avatar

Stargazers

 avatar

Watchers

 avatar

Forkers

aniketprasadgit

team-builder's Issues

Console.table

  • Use console.table to display data in the terminal instead of console.log

Dynamic CSS

Add inquirer questions to make dynamic CSS values populate into HTML

  • Color theme for header and card background colors
  • Color for card title section (should be a lighter hue color)
  • Font family
  • Different icon options for each position

Team Name

  • Add Prompt for Custom Team Name in the Manager Questions
  • Add the team name value into the HTML generated

CSS

  • Add more CSS styling
  • Increase font size of card's text
  • Enhance the team name heading

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.