/tweeter

A twitter clone project, to help students gain front-end dev chops. Starter (incomplete) code.

Primary LanguageJavaScript

Tweeter Project

Tweeter is a simple, single-page Twitter clone.

This repository is the starter code for the project: Students will fork and clone this repository, then build upon it to practice their HTML, CSS, JS, jQuery and AJAX front-end skills, and their Node, Express and MongoDB back-end skills.

Highlights

  • Desktop, Tablet, and Mobile friendly interfaces.
  • From the homepage, tweet-box will open when clicking the animated arrow in the top right nav bar.
  • Warning messages slides if your tweet is empty or goes over 140 characters.
  • Box shadows when hovering over previous tweets.
  • Icons highlights when hovering over the three icons in the previous tweet boxes.
  • Tweets are prevented from XSS.

Screenshots

Desktop Interface

"Desktop view"

Tablet Interface

"Tablet view"

Mobile Interface

"Mobile view"

Warning Example - Empty Tweet

"Warning view"

Getting Started

  1. Fork this repository, then clone your fork of this repository.
  2. Install dependencies using the npm install command.
  3. Start the web server using the npm run local command. The app will be served at http://localhost:8080/.
  4. Go to http://localhost:8080/ in your browser.

Dependencies

  • Express
  • Node 5.10.x or above
  • Body Parser
  • Chance
  • Express
  • MD5
  • Nodemon