/tweeter-

Primary LanguageJavaScript

Tweeter Project

Tweeter is a simple, single-page Twitter clone.

When users type a tweet, the program will return the tweet to the main page with a random name, handle and avatar image.

"Screenshot of homepage"

Features

You can type your own tweet to appear on the page! Type your tweet in the box

"Screenshot of tweet1"

After clicking "Tweet", your tweet will pop up as the newest tweet. Any tweet box you hover over will have a shadow effect.

"Screenshot of tweet2"

You can even hover the icons and they will change colors.

"Screenshot of icon"

Errors

A valid tweet must be under 140 characters and cannot be empty. An error message will appear if a non valid tweet is being submitted.

"Screenshot of error1"

"Screenshot of error2"

Dynamic Sizes

Tweeter has 3 sizes for desktop, tablet and mobile. The screenshots above showcase the desktop. The other 2 are shown below.

Tablet screen:

"Screenshot of tablet"

and

Mobile screen:

"Screenshot of mobile1"

"Screenshot of mobile2"

Getting Started

  1. Create a new repository using this repository as a template.
  2. Clone your repository onto your local device.
  3. Install dependencies using the npm install command.
  4. Start the web server using the npm run local command. The app will be served at http://localhost:8080/.
  5. Go to http://localhost:8080/ in your browser.

Dependencies

  • body-parser
  • chance
  • express
  • jquery
  • md5
  • timeago.js
  • nodemon