An open API service indexing awesome lists of open source software.

https://github.com/todd-demone/tweeter

A simple, single-page Twitter clone. Built with jQuery, Sass, Webpack and Babel.
https://github.com/todd-demone/tweeter

es6 javascript nodejs sass webpack

Last synced: 3 months ago
JSON representation

A simple, single-page Twitter clone. Built with jQuery, Sass, Webpack and Babel.

Awesome Lists containing this project

README

          

# Tweeter Project

Tweeter is a simple, single-page Twitter clone.

## Purpose

I created Tweeter while completing the [Lighthouse Labs](https://github.com/lighthouse-labs) [Web Development Flex Program](https://www.lighthouselabs.ca/en/web-development-flex-program). The project helped me develop proficiency in the following languages and tools:

- HTML
- CSS including SASS
- JavaScript including jQuery, AJAX and ES6 modules
- Webpack
- Babel
- Node
- Express

## Screenshots

#### Basic functionality

!["Toggling the tweet form"](https://github.com/todd-demone/tweeter/blob/master/docs/toggle-tweet.gif?raw=true)

#### Responsive breakpoints

!["Responsive breakpoints"](https://github.com/todd-demone/tweeter/blob/master/docs/responsive-breakpoints.gif?raw=true)

#### Character counter and error message

!["Character counter and error message"](https://github.com/todd-demone/tweeter/blob/master/docs/error-long-tweet.gif?raw=true)

## Getting Started

Clone the repository and run the app using the following commands in the terminal:

```bash
git clone https://github.com/todd-demone/tweeter.git
cd tweeter
npm install // installs all of the dependencies
npm run start // starts the web server
```

To use the app, go to in your browser.

## Dependencies

- [node](https://nodejs.org) (I used version 12.18.2)
- [body-parser](https://www.npmjs.com/package/body-parser)
- [chance](https://www.npmjs.com/package/chance)
- [express](https://expressjs.com/)
- [jquery](https://jquery.com/)
- [timeago.js](https://www.npmjs.com/package/timeago.js)
- [babel](https://babeljs.io/)
- [nodemon](https://www.npmjs.com/package/nodemon)
- [sass](https://sass-lang.com/)
- [webpack](https://webpack.js.org/)

## Author

[Todd Demone](https://github.com/todd-demone)