https://github.com/artelydev/vue-shortener

:fire: Vue.js URL Shortener
https://github.com/artelydev/vue-shortener

coffeescript coffeescript2 expressjs heroku postcss pug pug-template-engine pugjs stylus sugarss url-shortener vue

Last synced: about 13 hours ago
JSON representation

:fire: Vue.js URL Shortener

• Host: GitHub
• URL: https://github.com/artelydev/vue-shortener
• Owner: artelydev
• Created: 2018-09-29T20:17:43.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2024-09-11T04:28:40.000Z (14 days ago)
• Last Synced: 2024-09-19T00:13:58.564Z (6 days ago)
• Topics: coffeescript, coffeescript2, expressjs, heroku, postcss, pug, pug-template-engine, pugjs, stylus, sugarss, url-shortener, vue
• Language: Vue
• Homepage: https://vue-shortener.herokuapp.com/
• Size: 191 KB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 41
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# :lollipop: Vue URL Shortener

This is ***backend-agnostic*** project structure as opposed to [monolithic example](https://github.com/cxsper/react-shortener/tree/react).

What I'm gonna use:

* [Vue](https://github.com/vuejs/vue)

* [Webpack](https://github.com/webpack/webpack) for bundling & developing

* [Pug](https://github.com/pugjs/pug) template engine

* [vue-cli](https://github.com/vuejs/vue-cli)

* My [vue-cli-plugin-coffee](https://github.com/cxsper/vue-cli-plugin-coffee) to support [CoffeeScript2](https://github.com/jashkenas/coffeescript)

* [vue-loader](https://github.com/vuejs/vue-loader) for loading `.vue` components

* My [vue-cli-plugin-sugarss](https://github.com/cxsper/vue-cli-plugin-sugarss) to support [SugarSS](https://github.com/postcss/sugarss) linting

* [Stylus](https://github.com/stylus/stylus) CSS Preprocessor

* [PostCSS](https://github.com/postcss/postcss) for `lint`ing and `autoprefix`ing mostly

* [Babel](https://github.com/babel/babel)

* [express](https://github.com/expressjs/express) for static serving

* [Heroku](https://heroku.com) for delpoyment

----

## Development

```shell

$ npm run serve

```

---

## Project Structure

### `public`

Static files.

### `src/api`

API module for `count`ing, `store`ing and `get`ing `Links`.

### `src/components`

This one serves as the VueJS `components'` storage. Usually `src/components/`.sample contains `.vue` files with:

* a logic written in `script[lang=coffee]`;

* a template written in `template[lang=pug]`;

* styles written in `style[lang=stylus][scoped]`;

### `src/utils/base62.coffee`

`base62` number encoder.

### `src/utils/variables.sss`

`Stylus/SugarSS` variables.

### `src/App.vue`

`Vue` instance.

### `src/main.js`

Entry point.

---

:tada: