Skip to content

Commit

Permalink
updated README and added Linux support
Browse files Browse the repository at this point in the history
  • Loading branch information
hubelin committed Mar 22, 2019
1 parent 08d023c commit 30a0a32
Show file tree
Hide file tree
Showing 4 changed files with 38 additions and 16 deletions.
34 changes: 23 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,25 @@
An open source Vue application prototyping tool for developers and designers.
</h3>

PreVue allows the user to design/visualize their component architecture - previewing their components' HTML, setting up views/routes, establishing parent-child component relationships - and then export their component architecture as a Vue application created with the default Vue CLI settings.
PreVue allows the user to design/visualize their component architecture by allowing users to :

1. Create components and preview their code

2. Set up different views/routes

3. Establish parent-child component relationships

4. See their application architecture in tree format

and then optionally export the component architecture as a Vue application created with the default Vue CLI settings.

## Getting Started

---

Download for [MacOS](https://s3.amazonaws.com/prevue-app/prevue-1.0.0.dmg)
Download for [MacOS](https://s3.amazonaws.com/prevue-app/prevue-1.0.0.dmg) & [Linux](https://s3.amazonaws.com/prevue-app/PreVue_1.0.0_amd64.deb)

Support for Window and Linux coming soon
Support for Windows coming soon

- Mac users only: for now you might need to go to your security settings to allow the app run on your system as we do not have an Apple license yet.

Expand All @@ -38,32 +48,34 @@ If you find any issues, [file issue](https://github.com/teamprevue/PreVue/issues

- Once you're satisfied, click the button to add a component and it will show up in the center stage, with the ability to resize!

<img src='http://g.recordit.co/A6rOQRJVOc.gif'/>
<img src='http://g.recordit.co/fyQ6LKvwlt.gif'/>

#### Editing Components

- Edit components by double clicking for the edit modal to show
- Add additional elements to a component with live preview of the component code
- Drag elements on the right side bar to nest
- Add additional elements to a component with a live preview of the component code
- Drag elements on the right side bar to nest elements
- Establish parent-child component relationships via a dropdown menu when creating or editing components

<img src='http://g.recordit.co/A6rOQRJVOc.gif'/>

#### Adding Routes/Projects

- Create different routes for your application by entering a new name and pressing enter
- Any components created on a certain route will automatically save to that route
- Play with multiple projects by clicking the add project icon
- Display a tree view of entire Vue application component architecture when the tree icon on navbar is clicked
- Create different routes for your application by entering a new route name and pressing enter
- Any components created on a certain route will be automatically saved to that route
- Play with multiple projects by clicking the add project icon!
- Display a tree view of entire application component architecture when the tree icon on navbar is clicked

<img src='http://g.recordit.co/bfYwX1sdtl.gif'/>

#### Saving/Opening/Exporting Projects

- If you ever need to save your current project, click the save project icon to save a json to your local directory.
- If you ever need to save your current project, click the save project icon to save a json to your local directory
- Next time the application is started, open the project again by clicking the open project icon!
- Once you're satisfied, click the export project icon to export your awesome project as new Vue application!

<img src='http://g.recordit.co/uFLqyjAnMm.gif'/>

##### Code Exporting

Below is the generated directory structure of the Vue application that is created when you export your design.
Expand Down
Binary file added build/icon.ico
Binary file not shown.
6 changes: 5 additions & 1 deletion electron-builder.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"appId": "com.electron.PreVue",
"mac": {
"category": "public.app-category.developer-tools",
"icon": "dist/icon.icns"
"icon": "build/icon.icns"
},
"files": ["out"],
"nsis": {
Expand All @@ -23,6 +23,10 @@
]
},

"linux": {
"target": ["deb"]
},

"publish": [
{
"provider": "s3",
Expand Down
14 changes: 10 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,20 +1,24 @@
{
"name": "PreVue",
"author": {
"name": "teamprevue",
"email": "[email protected]",
"url": "www.prevue.io"
},
"version": "1.0.0",
"description": "Developer prototyping app built with Vue on Electron",
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build --publish never",
"electron:release": "vue-cli-service electron:build --publish always",
"electron:build": "vue-cli-service electron:build -ml --publish never",
"electron:release": "vue-cli-service electron:build -ml --publish always",
"electron:serve": "vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps",
"test:unit": "vue-cli-service test:unit"
},
"author": "team prevue",
"license": "ISC",
"license": "MIT",
"dependencies": {
"buefy": "^0.7.3",
"fs-extra": "^7.0.1",
Expand All @@ -27,6 +31,7 @@
"vue-multiselect": "^2.1.4",
"vue-router": "^3.0.1",
"vued3tree": "^3.6.4",
"vuedraggable": "^2.19.3",
"vuex": "^3.0.1"
},
"devDependencies": {
Expand All @@ -40,6 +45,7 @@
"babel-eslint": "^10.0.1",
"babel-jest": "^23.6.0",
"electron": "^3.0.0",
"electron-builder-squirrel-windows": "^20.39.0",
"electron-compile": "^6.4.4",
"electron-compilers": "^5.9.0",
"electron-prebuilt-compile": "^4.0.0",
Expand Down

0 comments on commit 30a0a32

Please sign in to comment.