Tweeter Project

Description

Tweeter is a simple, single-page Twitter clone using HTML, CSS, JS, jQuery and AJAX on the front-end Node, Express and MongoDB back-end.

Users are able to submit tweets up to 140 characters and have the tweet dynamically render in the list below.

Dependencies

• Express
• Node 5.10.x or above
• Body-parser
• Chance
• jQuery
• md5
• MongoDB

Getting Started

1. Install all dependencies (using the npm install command).
2. Run the development web server using the node server/index.js command. The app will be served at http://localhost:8080/.
3. Go to http://localhost:8080/ in your browser.

Final Product

Tweeter homepage:

When "Compose" button is selected, the new tweet form appears:

Submitting a new tweet:

Note the character counter in the bottom right corner of the form adjusts as content is typed in the input field.

Upon submission, the tweet appears below, with tweets being sorted with those most recently created first.

When hovering a tweet the tweet will appear at 100% opacity.

Tweet validation and error states:

The new tweet form validates the tweet content based on character length, displaying errors when attempting to submit an empty tweet or a tweet longer than 140 characters.