0.1.0 • Published 4 years ago
ad-preview-tool v0.1.0
About the application
The following application named, DeltaX - Ad Preview Tool , is a tool that can be used for generating mock advertisemets so as to mimic the look and feel of an ad on multiple advertisement channels. The currently supported channels are Facebook and Instagram.
Component Structure
├── public
├ ├── index.html
├── src
├ ├── api
├ ├ ├──── index.js
├ ├── assets
├ ├── modules
├ ├ ├──── channels
├ ├ ├ ├──── sidebar.vue
├ ├ ├──── templateEditor
├ ├ ├ ├──── components
├ ├ ├ ├ ├──── Facebook_CarouselForm.vue
├ ├ ├ ├ ├──── Facebook_SingleForm.vue
├ ├ ├ ├ ├──── Instagram_FeedCarouselForm.vue
├ ├ ├ ├ ├──── Instagram_FeedSinglelForm.vue
├ ├ ├ ├ ├──── Instagram_StoryCarouselForm.vue
├ ├ ├ ├ ├──── Instagram_StorySingleForm.vue
├ ├ ├ ├──── constants
├ ├ ├ ├ ├──── FacebookAdForm.vue
├ ├ ├ ├ ├──── InstagramAdForm.vue
├ ├ ├──── adPreview
├ ├ ├ ├──── components
├ ├ ├ ├ ├──── Facebook_DesktopCarousel.vue
├ ├ ├ ├ ├──── Facebook_DesktopSingle.vue
├ ├ ├ ├ ├──── Facebook_MobileCarousel.vue
├ ├ ├ ├ ├──── Facebook_MobileSingle.vue
├ ├ ├ ├ ├──── Instagram_FeedCarousel.vue
├ ├ ├ ├ ├──── Instagram_FeedSigle.vue
├ ├ ├ ├ ├──── Instagram_StoryCarousel.vue
├ ├ ├ ├ ├──── Instagram_StorySingle.vue
├ ├ ├ ├──── contants
├ ├ ├ ├ ├──── createSimilar.vue
├ ├ ├ ├ ├──── exportAssets.vue
├ ├ ├ ├ ├──── FacebookAdPreview.vue
├ ├ ├ ├ ├──── InstagramAdPreview.vue
├ ├ ├ ├──── SUPPORT
├ ├ ├ ├ ├──── Facebook_carouselCardSupport.vue
├ ├── helpers
├ ├ ├──── base64toBlob.js
├ ├ ├──── mediaUpload.js
├ ├── services
├ ├ ├──── previewData.js
├ ├── store
├ ├ ├──── index.js
├ ├ ├──── modules
├ ├ ├ ├──── AdRendering.js
├ ├ ├ ├──── FacebookStore.js
├ ├ ├ ├──── Gallery.js
├ ├ ├ ├──── InstagramStore.js
├ ├── main.js
├ ├── App.vue
├── .eslintrc..js
├── vue.config.js
├── README.md
├── babel.config.js
├── package-lock.json
├── package.json
├── .gitignore
Project setup
npm install
Run development mode
npm run serve
Run backend database
cd backend
json-server --watch db.json
Compiles and minifies for production
npm run build
IMPORTANT BUG FIXES
- Generate preview failed without any custom image, due to failure to search for the base64 of the stock image. Fixed by added a try catch block in previewData.js service
0.1.0
4 years ago