Тёмный
No video :(

Ionic 4 Theme Builder with CSS Variables 

Fireship
Подписаться 3,3 млн
Просмотров 53 тыс.
50% 1

Build a dynamic theme generator with Ionic 4 using nothing but CSS variables. angularfirebas...
- CSS Variables developer.mozi...
- Coolors.co coolors.co/
- Ionic 4 Docs ionicframework...

Опубликовано:

 

27 авг 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 78   
@brettshep
@brettshep 6 лет назад
Another great video. I found your channel a long time ago when I was just beginning Angular. I just launched my first product today on product hunt, and just wanted to give you credit for helping me grow as a developer
@Fireship
@Fireship 6 лет назад
Wow, that's awesome! Do you want to share the link so I can upvote it :)
@brettshep
@brettshep 6 лет назад
Sure that'd be awesome! www.producthunt.com/posts/font-flipper
@Fireship
@Fireship 6 лет назад
Dude! That is an awesome app. I'd love to feature it in a video. Message me on slack if you'd be interested in that goo.gl/qF8Q5r
@brettshep
@brettshep 6 лет назад
Sounds awesome! I sent a message in slack.
@pietersydney
@pietersydney 6 лет назад
Great app!
@Pranaytubes
@Pranaytubes 6 лет назад
Thanks for the video Jeff. Look forward to your full ionic 4 course. One item to cover would be some in depth on notifications - not just the setup part (which you have done pretty well already), but also the firestore side of it. So say I am subscribed to 10 tags (weather by city / football teams etc) and a notification is sent for that tag. What is the right approach to store the info in database? How do you keep a tab of counts for each user for "new notifications", and when the use sees a specific set of notification, what do you update in the database vs what you do update in the local storage on his app? Other items I would suggest are: 1. Ionic app performance - how to get the best of what we have got, as close to native as possible? 2. Ionic storage: what goes in local storage vs what goes in firestore (for performance, offline usage etc). and 3. Setup "firebase app" for production usage (meaning having two separate firebase app - one for dev environment and one for prod for a single application)? Essentially the BEST practices that we cannot find anywhere else. Cheers!
@rayscott5352
@rayscott5352 6 лет назад
Brilliant as usual! In your up coming Ionic 4 course I would love to see how you can incorporate an Ionic 4 searchbar with Algolia search.
@Fireship
@Fireship 6 лет назад
That would be cool, have not done an ionic algolia integration on native yet
@benjaminjameswaller
@benjaminjameswaller 6 лет назад
great tutorial Jeff. looking forward to the course. 🙂
@Fireship
@Fireship 6 лет назад
Thanks Ben!
@jesucristoesteban908
@jesucristoesteban908 6 лет назад
I'll become pro once again if you make that new course with ionic 4
@kyeongjunlee7401
@kyeongjunlee7401 6 лет назад
I can't wait for ionic 3 + firebase project thang! pumped
@carrillocarlosce
@carrillocarlosce 6 лет назад
Hi, I had a an app in ionic 3 and I've been migrating it to ionic 4 and the results are very good, performance is awesome, the only thing that surprise me is that for android it has to be at least API SDK 24, but its ok for me, i've been fithing a lot with theming, couse it has change a lot, so thanks for the tutorial
@Fireship
@Fireship 6 лет назад
All the changes are positive IMO, but a complex app could be hard to migrate. That's partly why I'm developing a new course from scratch.
@carrillocarlosce
@carrillocarlosce 6 лет назад
Yes, its hard and my app was almost finished but for a greater good I decided so. BTW something you should cover in the course is the lazy loading routing, I dont understand how it really work, when using nested routes if i got into a route for the first time it works well, but when i go back to a root and then i want to enter again in a nested lazy loaded route it just dont do anything, I hope to se this cover in your course because its a real pain XD
@adithyasbhat
@adithyasbhat 5 лет назад
Hey@@carrillocarlosce, can i get the sample Ionic 4 template. just need check with my build, could you please help me with this. bhat.s.adithya@gmail.com. thanks:)
@QwertyNPC
@QwertyNPC 6 лет назад
When the course You mention comes out I'll definitely go pro. I'd love to see something like multiple devices real time position tracking with firebase and google maps api.
@Fireship
@Fireship 6 лет назад
I will very likely include a section on geolocation :)
@jamieperkins906
@jamieperkins906 6 лет назад
Pretty sure I heard a "meow" at 6:02 😂
@Fireship
@Fireship 6 лет назад
Haha, it does sound like a meow, but that's impossible. Must have been my two-year old :)
@omarhegazi1613
@omarhegazi1613 6 лет назад
me too
@Skia_
@Skia_ 6 лет назад
Bro i know you're Angular/ionic advocate. But what do you think of Flutter? Also, great content as always. You're godsend :D
@Fireship
@Fireship 6 лет назад
I think flutter is great and may do vids on it in the future. In fact, I have a side project being built with flutter now. But there are tradeoffs, both good and bad. Ionic is still the fastest path to an app if you know the web.
@d4lep0ro
@d4lep0ro 6 лет назад
Great content as always.
@Fireship
@Fireship 6 лет назад
Thanks for watching :)
@saadabbasi2063
@saadabbasi2063 6 лет назад
Superb :) thanks Jeff
@Fireship
@Fireship 6 лет назад
Thanks Saad!
@mrgrossartig
@mrgrossartig 4 года назад
Great video
@will_abule
@will_abule 6 лет назад
Thanks allot for this I'm being waiting for it.
@swellingtonsantos9532
@swellingtonsantos9532 5 лет назад
Very good.
@JFkingW
@JFkingW 6 лет назад
Have you had a look at ng-toolkit/universal and ng-toolkit/serverless yet? Its supposed to make SSR with only a few cli commands. A Video how to use it and host it on firebase would be awesome
@Fireship
@Fireship 6 лет назад
I've seen that before, but have not tried it out yet. Thanks for the suggestion :)
@moradabdelgaber5958
@moradabdelgaber5958 6 лет назад
Awesome video as usual :)
@Fireship
@Fireship 6 лет назад
Thanks Morad!
@ampiyong
@ampiyong 5 лет назад
Hi, I would like to ask what plugin did you use to show the color in your editor inside a typescript. Thanks :)
@johnshields_
@johnshields_ 3 года назад
WebStorm can do this
@ashwinsharan6462
@ashwinsharan6462 2 года назад
Hey add a bit about the media capture plugin and also how we can store that on firebase!
@VivekGawande1
@VivekGawande1 6 лет назад
For the pro series - I'd love to see a video on how to deploy and test an ionic app on iOS with a Mac. Is there some sort of emulator available? I've heard that iOS development is a pain. I'd also love to see how can you differentiate between users in ionic/angular/firebase. Suppose an uber app has two types of users: drivers and customers. When they login to the app, what's the best way to take them to their respective dashboards?
@ikezedev
@ikezedev 6 лет назад
Thanks so much for this video..... I would love to buy your course on Ionic native and firebase, but I'm broke. Could you help me please.... Your biggest fan 😍
@Fireship
@Fireship 6 лет назад
Yes, when it releases I'll provide a discount code to make it super affordable or maybe even free.
@PhillipMwaniki
@PhillipMwaniki 6 лет назад
I'm waiting in line for the promo code. I wish there was a place to subscribe by mail
@ikezedev
@ikezedev 6 лет назад
Thanks so much Jeff, you are blessing
@VivekGawande1
@VivekGawande1 6 лет назад
You're the best Jeff! I'd happily buy your course because honestly you're the best teacher I've ever seen for Firebase
@saadabbasi2063
@saadabbasi2063 6 лет назад
So excited, its a big claim thar we will not find that stuff anywhere else. This will keep my eyes on open until you release the course
@wes443
@wes443 6 лет назад
I would like to see a video on dynamically loading components. For example, how would I implement functionality to create a component on a button click?
@Fireship
@Fireship 6 лет назад
I like that, but what type of component do you have in mind? Can you expand on a use case
@wes443
@wes443 6 лет назад
Certainly. So I think a typical use case for this would be something like a configurable dashboard with widgets. So the user would initially load a blank dashboard and there would be 3 buttons (Load Widget A, Load Widget B, Load Widget C). When you click each button, it would load the appropriate widget (which would be an Angular component) and add it to the dashboard. Another use case would be an application for plotting (like in your PlotlyJS video). There would be some way to dynamically add new types of plots to the page, for analyzing different data.
@Fireship
@Fireship 6 лет назад
Awesome, thank you. I will definitely think about adding something along these lines.
@wes443
@wes443 6 лет назад
Angular Firebase Thanks for the consideration!
@kouassidje2595
@kouassidje2595 5 лет назад
Good evening, I just installed ionic v5, and I wanted to add my html template to make it native. But I have trouble adding css and javascript. Help me please
@aswin123ify
@aswin123ify 5 лет назад
Hi, It was a nice video tho i have slightly different scenario, can we generate theme dynamically based on the database results. Like value for text-color will be received from database.
@johngeronimo8821
@johngeronimo8821 3 года назад
I got an error "NullInjectorError: No provider for Storage!" is there any way to fix this?
@CSBD_Official
@CSBD_Official 6 лет назад
really awesome.
@abdullahgd9
@abdullahgd9 5 лет назад
How to use the Angular Material’s theme colors in components
@bF93712
@bF93712 4 года назад
Ionicv4 with stenciljs! Would be cool!
@snipe3045
@snipe3045 6 лет назад
@angularfirebase what theme are you using for your vs code?
@Fireship
@Fireship 6 лет назад
Atom One Dark + VS Code Icons
@davetaylor1666
@davetaylor1666 6 лет назад
For your next pro video, how about including details of how to detect if app is offline, and to what extent Angularfire2 can be used offline. Also, how would App Auth work when offline ?
@Fireship
@Fireship 6 лет назад
I like that idea. Offline line is one of the more difficult areas to test and maintain. Are you more interested in iOS/Android offline or web apps?
@davetaylor1666
@davetaylor1666 6 лет назад
Angular Firebase I'm developing an Ionic 4 app (with much help from you), so would be most interested in how well an Ionic 4 App could still function while offline.
@davetaylor1666
@davetaylor1666 6 лет назад
Sorry, i misunderstood youy question. Ios/Android offline would be most useful,.
@byronglendon3947
@byronglendon3947 5 лет назад
Look forward to the new course. I would like to see: 1. PWA's with Capicitor (Push notifications & Camera etc) 2. Email receiving (not just sending) with Mailgun or similar 3. Animated radial navigation. eg. www.jqueryscript.net/images/Path-Style-Round-Menu-Plugin-with-jQuery-CSS3-FerroMenu.jpg miro.medium.com/max/1400/1*1V-qn291fz_slQGCCdbdow.jpeg
@moradabdelgaber5958
@moradabdelgaber5958 6 лет назад
can I do this with ionic 3 ??
@Fireship
@Fireship 6 лет назад
It's possible because CSS variables are a browser implementation, but Ionic 4 has all the pieces in place for the ideal developer experience.
@himesh_89
@himesh_89 6 лет назад
how to architect on firebase.
@supermikeadventures6185
@supermikeadventures6185 6 лет назад
Is this possible for Ionic3?
@srashtigupta59
@srashtigupta59 Год назад
Inside the homepage.html content
@PezhvakIMV
@PezhvakIMV 6 лет назад
may i know what's the music name in the background when you start talking please?
@chandra80inbox
@chandra80inbox 6 лет назад
like to join the course ionic with firebase .
@Fireship
@Fireship 6 лет назад
I expect it to be finished within 1 to 2 weeks, will post it on the channel when ready :)
@chandra80inbox
@chandra80inbox 6 лет назад
eagerly waiting
@mrshimizer
@mrshimizer 6 лет назад
I applied this method for ionic 3 but it does not set a new index, what do I have to do. github.com/Alan4747/Ionic-3-Dynamic-CSS-Theme
@krivoviajes
@krivoviajes 5 лет назад
Ponle subtitulos a los tutoriales, no entiendo nada en ingles jajaja
@ZeroG84
@ZeroG84 4 года назад
These types of tutorials really make me want to clean my teeth with a gun. Speed is hectic. Had to watch in x0,5 times speed just to understand what was said in that monotone voice. Did you speed this up in edit, or are you on something? The fact you just paste in stuff to the editor lazily from another screen and it appears out of thin air, line after line and chunk after a bigger chunk, is not helping with the speed thing either. Second, you did not show any of the UI how you linked the buttons to change the css, or where the value should be sent and in what form. In fact, you did not run the actual project you "built" at all. It was always open in the background. So... "thanks" I guess. You made me quit coding. That was your goal with this video, right? It really did the job.
@tiagobrancoprata7578
@tiagobrancoprata7578 5 лет назад
found it profoundly useless....
@ZeroG84
@ZeroG84 4 года назад
These types of tutorials really make me want to clean my teeth with a gun. Speed is hectic. Had to watch in x0,5 times speed just to understand what was said in that monotone voice. Did you speed this up in edit, or are you on something? The fact you just paste in stuff to the editor lazily from another screen and it appears out of thin air, line after line and chunk after a bigger chunk, is not helping with the speed thing either. Second, you did not show any of the UI how you linked the buttons to change the css, or where the value should be sent and in what form. In fact, you did not run the actual project you "built" at all. It was always open in the background. So... "thanks" I guess. You made me quit coding. That was your goal with this video, right? It really did the job.
Далее
Ionic 4: Should you Build a Hybrid App?
10:35
Просмотров 254 тыс.
The Story of Next.js
12:13
Просмотров 568 тыс.
ПРАВО НА ЖИЗНЬ НУЖНО ВЫИГРАТЬ
32:38
Avaz Oxun - 10 yillik yubiley konsert dasturi 2023
2:52:33
Kim Dotcom is in mega big trouble
4:19
Просмотров 861 тыс.
Styling a Shadow DOM in Ionic #ionic #angular
14:46
Просмотров 25 тыс.
FastHTML in 2 Minutes
2:00
Просмотров 9 тыс.
The JavaScript Survival Guide
14:47
Просмотров 725 тыс.
When RESTful architecture isn't enough...
21:02
Просмотров 272 тыс.
ПРАВО НА ЖИЗНЬ НУЖНО ВЫИГРАТЬ
32:38