i'm working on an ionic v1 (and angular 1) project which is completed using basic ionic UI. I came across various themes on ionic marketplace. How do i integrate a new ionic theme to my existing app.
I'm assuming you have Ionic setup in your local machine.
Once you've purchased and downloaded the files of the theme you want to use, create an ionic1 project. Note this will work only with Ionic1, and not Ionic2. Use the following command to create an ionic1 project:
ionic start myApp blank --type ionic1
When your project has been created, go to the /www folder in your project directory, delete all files in here, and copy the theme's files you've downloaded here.
Run ionic serve and your project should have integrated with the theme.
PS. you might have to replace the project scss folder with that of the theme's if available.
Related
The existing project is MVC with ExtJS. We want to migrate ExtJs to ReactJs alone instead of entire project.
I want to create react-app with existing Asp.net MVC.
I have tried to create using create-react-app or Vite.
But the idea to run Asp.net mvc with ReactJs is,
Build react app (will watch build folder)
The build output should target _layout.cshtml instead of index.html.
So that the built files will be included in _layout.cshtml and when we run the mvc application, the app will run without any issues.
Is there any idea to build without index.html and target _layout.cshtml?
Or
Is there any alter idea other than this?
Folder structure on vs code
I have the above file structure. I have used react js inside the laravel framework combined.
It's a brand new project just with react --auth scaffolding inside the laravel project.
I can deploy just the laravel project but don't know how to deploy the react-laravel combined web app. please help
You must build project on your local machine and then upload whole project structure on server. When you build it, it will generate css and especially js files which are key files for your react part. Upload all content and it will work fine.
I have a gulp angular project with the following structure. To serve it as a web app, I use the command gulp serve. Gulp then does some magic that rearranges all the files in the .tmp directory. I would like to take the web app and convert it to an ionic app. I attempted to follow the steps here (How to convert an existing Angular1 web app to a Cordova app?), but it seems that due to gulp I have a few additional steps.
To attempt this on my own, I:
Setup an empty ionic project,
Copied the contents of my src folder to the ionic apps www folder, and
Ran ionic serve.
The gulp setup was done by a coworker, so the inner workings of it are something of an enigma.
You cannot do it that easily. Ionic works with it's specific angular directives, like ion-nav-views, ion-views, ion-content, etc. you need to wrap all your states/views inside this directives and transform your navigation system into tabs or side menu (mobile app navigation systems) to make it work. There's a lot of workaround to do!
I built a web-app using AngularJS + Angular Material and now want to deploy it to the AppStore (using Cordova I guess?)
What are the steps that I need to do to achieve this?
Install cordova
npm install -g cordova
Create a new cordova project.
cordova create hello com.example.hello HelloWorld
This will create new directory - hello and inside hello you will have your new cordova project - HelloWord, package name - com.example.hello
Add your angularjs app code to 'www' folder inside hello directory.
Now add iOS as a platform to your cordova project.
cordova platform add ios --save
If you need to access gallery, camera, or any other device feature, you will have to add a cordova-plugin for same.
For example to get access to device camera.
cordova plugin add cordova-plugin-camera
Read more about how you will handle events associated with camera inside your angular app. Go through that plugin's documentation.
I would recommend you to use ng-cordova for using cordova-plugins. Read more about ng-cordova here.
Now you will build your cordova project to generate .ipa file for iOS device.
cordova build ios
Inside your hello directory you will have a xcodeproj file -hello/platforms/ios/hello.xcodeproj open it in Xcode and run on an emulator to test.
Purchase your apple developer account and sign into your xcode with your apple account.
From Xcode you will get option to Archive And Publish your app to Appstore.
Few links to get started
App store documentation to know detailed publishing process here
Cordova documentation here
The theming guide says to run Sencha Cmd to:
- setup the workspace
- generate a test app to test the custom theme
The test app created in the theming guide is located inside the workspace folder. My question is, does the app that will use the theme need to be located inside the workspace folder? Or can it reside elsewhere, and it simply uses the built custom theme?
We have an existing app that we now want to use a custom theme, so the app is not inside a workspace. Can I just create the workspace for the custom theme, and make changes for styling necessary to implement the theme? Do I need to make configuration changes in the generated workspace so it is aware of the location of the code for the app which is not in the workspace?
Thanks in advance!
As far as I know, your project, where you wanted to apply the theme, must be generated by Sencha CMD. After generating the project, copy everything from the existing project to the new sencha cmd-generated project.
On the terminal, execute sencha generate theme my-custom-theme on the application directory. Your my-custom-theme will be created on the packages directory of your project folder. In order to use this theme, edit sencha.cfg found on the [project folder]/.sencha/app/. Change the app-theme to app.theme=my-custom-theme.
In order for the changes to take effect, execute sencha app refresh.
The theme, i.e. .scss files, eventually converted into a CSS file. You need to include this generated CSS file in your index.html. This is regardless of how you get or generate the CSS file.
I do not think your existing project need to be inside your new 4.2 theme project. However, it is much easier to test if you are creating a new theme and they reside in the same project.
It is not difficult to put your existing .js files into 4.2 project. I had to replace the app directory from the old project and some update to files. You can find the details in the ExtJS upgrade guide.
In the new Sencha Architect 3, there's an added feature of Application Styling. See here: http://docs.sencha.com/architect/3/#!/guide/styling
I'm not sure but I think you can import your current ExtJS project into the Architect and start styling your application.