Тёмный

Creating News Application With Ionic 4 and Angular 

Baljeet Singh (Balli)
Подписаться 5 тыс.
Просмотров 124 тыс.
50% 1

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

 

15 окт 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 192   
@songlee8456
@songlee8456 6 лет назад
You explained so well, you need to start thinking about making a full course on ionic 4 and upload it on udemy
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I'll give it a thought
@Mayanktaker
@Mayanktaker 6 лет назад
Agree
@alimanzoor2359
@alimanzoor2359 5 лет назад
@@mbaljeetsingh make a clone like WhatsApp so you can cover all the native features like audio/video/photo/pdf as well
@judgewest2000
@judgewest2000 6 лет назад
i appreciate you using proper service layers. many examples don't
@kushal7966
@kushal7966 3 года назад
Thank you sir. I am new to ionic and angular. But you cleared by basic understanding of ionic. Keep making like this video.
@sodiqoyedotun3185
@sodiqoyedotun3185 5 лет назад
The best Indian programming tutor I've come across. dhanyavaad baljeet and bhagavaan aapaka bhala kare
@rehmansaifmohd
@rehmansaifmohd 5 лет назад
Great example and explained very well. Loved watching and re-watching and re-watching... !
@Kabir_Narayan_Jha
@Kabir_Narayan_Jha 5 лет назад
Great video this is my first video of ionic for my first app thanks for help
@sranjeit
@sranjeit 4 года назад
Hi Baljeet, thanks for the detailed video, How can I apply a back button on the header of news details page. However we can use device's back button. Please explain. Many Thanks
@sriganeshm5462
@sriganeshm5462 5 лет назад
Hi I am new to ionic Can you please upload a video of doing CRUD operation on database with rest apis
@pramodbhoite8925
@pramodbhoite8925 4 года назад
Hiii.... i build an app in ionic 3 .. it was run on my android device but not connect with my AWS database server... what can i do ?? Please help me
@alihasana2009
@alihasana2009 5 лет назад
Good Work Baljeet, How can i remove console warning cordova.js is not inculded Thanks for great efforts
@MrPrasadpankaj
@MrPrasadpankaj 3 года назад
bro your material was very good and easy to understand but i am facing CORS... issue while call api .it was not before.. i just want to show alert if i not getting data form api .then CORS issue start... so why it was not come in first time i run api many time more than 10 time. but no issue , after alert why it is … please tell me .. i have undo my change but it is not working..
@AwaidhGaming
@AwaidhGaming 4 года назад
Which terminal you are using. Please tell......
@mbaljeetsingh
@mbaljeetsingh 4 года назад
That will be Hyper
@sureshchristopher980
@sureshchristopher980 6 лет назад
Really awsome the way u r explained
@jbdioli
@jbdioli 5 лет назад
Hello Can you make a video about how to install all the environment? Node.js, Java, IONIC 4, Visual studio code with the extension you’re use, etc ... ? Thanks a lot
@yaredredman
@yaredredman 4 года назад
Nice tutorial man! I was able to follow through with no problems. Great teaching way.
@harisali7884
@harisali7884 5 лет назад
Thanks for that tutorial sir, completely impressed by how you explain. I have been searching for this from last 2 hours. U made everything clear in one go.
@innovativelife5378
@innovativelife5378 3 года назад
Thankyou so much for your efforts sir i learnt alot
@age_82
@age_82 6 лет назад
very well explained, thanks from Argentina.
@rsa_doluse7962
@rsa_doluse7962 6 лет назад
Great tutorial. You have explained very well. I'm a beginner in Ionic and this is what I needed at the moment. Thank you!
@saikinotes7799
@saikinotes7799 5 лет назад
Thankyou very much bro for this wonderful tutorial, but how can i navigate it to home (news) again when user started to click the content news itself.
@wesinec
@wesinec 5 лет назад
Hi, thanks for the video. I have one question about this and I will be glad if you can help me. I've tried to access another endpoint but I get the error: Access to XMLHttpRequest at 'endpoint' from origin 'localhost:8100' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. How can I dealing with this error?
@manuelmariscal7286
@manuelmariscal7286 5 лет назад
Please can you explain why it doesnt change the news-detail? i dont understand it, i did the same as you...
@webtrend8767
@webtrend8767 5 лет назад
very good and clear concept,,
@w123au
@w123au 5 лет назад
That is really good ... sardar jee ... chaaa gayeee hoo....
@rezwansaki
@rezwansaki 6 лет назад
Thanks. This tutorial is helpful. Please, try to make full tutorial for Ionic 4.
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
You're welcome. I have created a complete course on Udemy about Ionic 4. You can take a look.
@abyssfelo1602
@abyssfelo1602 4 года назад
Am getting an uncaght type Error. Cannot read property 'id' of undefined.
@mbaljeetsingh
@mbaljeetsingh 4 года назад
Can you be specific where you're getting this error
@MaathrFarkad
@MaathrFarkad 5 лет назад
Thank you so much I have benefited a lot
@jatinprajapati8861
@jatinprajapati8861 5 лет назад
Nice tutorial on Ionic4 and very useful. Keep it up. Thanks
@Suryaprakashchaturvedi999
@Suryaprakashchaturvedi999 5 лет назад
sir can you explain how to navigate from login page to tabs page. the one you created?
@fooboomoo
@fooboomoo 6 лет назад
Thank you for this, there is not much on ionic 4 yet, so this is really helpful for a beginning ionic dev.
@JFkingW
@JFkingW 6 лет назад
Do you know how to make it, so the news article opens in the same tab like the news list? So that you still have the tab bar and you can navigate with a back button back to the list? A video about that would be awesome
@ujjayhirbhagat5489
@ujjayhirbhagat5489 3 года назад
getting trouble with ionic 5 as you build this app in ionic 4 in tabs.module.ts I have only path option not the outlet or component also in HTML file there is no href tag in ionic 5 tabs menu will you please assist me to build this app in ionic 5 version
@mbaljeetsingh
@mbaljeetsingh 3 года назад
Will try to create new video with ionic 5
@sauravganguly6690
@sauravganguly6690 6 лет назад
sir this was a great tutorial...please make more tutorials on ionic!! Thank You :)
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I'll for sure
@ahmedchermiti7660
@ahmedchermiti7660 5 лет назад
why u replaced articles with data ??? and how u write the code *ngFor="let artcile of data.articles " where is articles variable after replacing it to data ??????
@junaidkhan891
@junaidkhan891 5 лет назад
Great Lecture 👍
@SahinAhmed
@SahinAhmed 4 года назад
Nice one please uoload more like ecommerce firebase mongodb
@DominicImbuga
@DominicImbuga 6 лет назад
Thanks Singh, You are a great teacher !
@lorddraagon
@lorddraagon 6 лет назад
I think I have an updated ionic 4 and I don't have a components folder in my project. Will it be a problem? And how the function of components folder is achieved in the latest version of ionic 4?
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
You can create the components folder similar to Ionic 3. Also, important thing is you need to important Components Module into the AppModule
@mohamedmohamed-tr7py
@mohamedmohamed-tr7py 5 лет назад
what angular version used
@vivekgautamj
@vivekgautamj 6 лет назад
Sir , I am thinking that whenever we are coming back to News Main page , there is https.get() call every time or not or Ionic 4 just saves the state of previous Page .....and Please make more videos on Ionic 4
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
You can make use of localStorage if you don't want to make the http call again and again. But If the data is changing often. It is required to to do.
@akarsh4822
@akarsh4822 5 лет назад
How do I integrate ads from Wordpress site into ionic app using rest api
@mahmoudtokura
@mahmoudtokura 5 лет назад
Awesome tutorial. Can you make a video on using Vue with Ionic for mobile apps. Thanks
@meow-lily
@meow-lily 5 лет назад
How to connect ionic app to back-end for maintaining the app
@mohank9065
@mohank9065 5 лет назад
sir ...it works well but i cant scroll down my card view.
@oneeminem2666
@oneeminem2666 6 лет назад
please make an ionic 4 tutorial it would really help a lot
@原貴悌
@原貴悌 5 лет назад
Cordova plugin is available for ionic 4 ???
@patrickgomes2261
@patrickgomes2261 4 года назад
What vscode theme you used in this tutorial?
@mbaljeetsingh
@mbaljeetsingh 4 года назад
I think it is Material Theme (Dark)
@FdikxfkkxZDFEWDCjdjSSa
@FdikxfkkxZDFEWDCjdjSSa 6 лет назад
can you type in the top of the terminal? the subtitle is covering what you typing
@rajeshbabu2699
@rajeshbabu2699 6 лет назад
HI, IONIC 4 BUILD APK NOT WORKING IN DEVICE, PLS ADVICE THE SOLUTION?
@iGameUZ
@iGameUZ 5 лет назад
dude, your hardware back button on android doesn't works... :(
@L1th1umz
@L1th1umz 5 лет назад
how to navigate back to News tab from News-Single without using the back button on the browser?
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
You can try adding button in the toolbar,
@Maya-rd6wh
@Maya-rd6wh 6 лет назад
I have a problem :( When I ionic generate, service is not in my list of choices. How do i go about solving it?
@QwertyNPC
@QwertyNPC 6 лет назад
Do you use VS Code ? You can add imports manually. Just type it out.
@carlostezna3514
@carlostezna3514 6 лет назад
great video. very good explanations
@KetanSingh
@KetanSingh 6 лет назад
Nice content. It would be great if you could use slightly larger texts so that they're more easily visible on a mobile screen
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
Ok, I'll take note of that
@wesinec
@wesinec 5 лет назад
is the installation of Cordova and Ionic Native plugins required before use httpClientModule ?
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
No, it isn't
@generativestudio
@generativestudio 5 лет назад
It works perfect but i cant view the full article of the story , is that because of the API?
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
There's a content field that contains the complete article text.
@generativestudio
@generativestudio 5 лет назад
@@mbaljeetsingh yes i use that field for the content but after a couple of words this appears "... [+3186 chars]"
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
@@generativestudio It could be the limitation of api
@chethannp5981
@chethannp5981 6 лет назад
Hi Baljeet Singh, Thank you for this great video :) .. I have a question on how to pass parameters to a different page earlier we use to user navCtrl.push('HomePage', {params}); ==> Not sure how to do it in the current version>?? any suggestions please!
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
You can still use navCtrl.push, but I won't recommend it. And regarding how you would do it in the current version is how you would do in a Angular cli app. Which is using router.navigate
@chethannp5981
@chethannp5981 6 лет назад
Thanks for replying, so you mean to say this.router.navigate(['/home'], {'title': 'leffe'}); will this work ?
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
@@chethannp5981 yes, something like this
@chethannp5981
@chethannp5981 6 лет назад
Let me try and confirm :) thanks for the quick reply... and forgot to add thank you so much for this heads up video!!!
@chethannp5981
@chethannp5981 6 лет назад
I am getting the error.. -- Passing parameters via router command Error -- loadMagazine(){ this.router.navigate(['', {filterType: 'magazine'}]); } Error: ERROR Error: Root segment cannot have matrix parameters -- Navaparams Error -- ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[HomePage -> NavParams]: StaticInjectorError(Platform: core)[HomePage -> NavParams]: NullInjectorError: No provider for NavParams!
@yaes8159
@yaes8159 2 года назад
sir can you do e-learning online course
@Chris.Plunkett
@Chris.Plunkett 6 лет назад
This is great thanks for taking the time to do this.
@RohitNanda26
@RohitNanda26 6 лет назад
Thank you for amazing video. Can you please create a video to convert existing Angular 6 Application into Ionic/Cordova for mobile application in simple steps? So It will really helpful for beginners
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I'll see what I can
@goatmasterau
@goatmasterau 5 лет назад
Great tutorial, thanks for your work!
@jagansai007
@jagansai007 6 лет назад
What's the theme / extensions you're using ? Code looks pretty with those
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I'm using Material Dark Theme for both VSCode and Hyper Terminal. And for the font/ font ligatures I'm using Fira Code, although I'm thinking about switching to default VSCode font again.
@jagansai007
@jagansai007 6 лет назад
Baljeet Singh thanks.
@MichalMacierzynski73
@MichalMacierzynski73 6 лет назад
whats that sparkling effect when you type ?
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
@@MichalMacierzynski73 If you mean in the command line, I'm using hyper terminal, this is one of the terminal extension (Hyper power)
@abhinandrajkumar7767
@abhinandrajkumar7767 5 лет назад
Good one. Thanks.
@MrGansoSalvaje
@MrGansoSalvaje 6 лет назад
Nice, Do you have some tutorial how install the native camera in a project,? i try with oficial documentation of Ionic 4 and doesnt work
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
Why issue are you facing?
@JoelMeaders
@JoelMeaders 5 лет назад
Nice tutorial! Thanks.
@thilinaranaweera3475
@thilinaranaweera3475 5 лет назад
great tutorial (Y) highly appreciated :) well done
@pkworlz
@pkworlz 6 лет назад
Waww.. nicely crafted..
@QwertyNPC
@QwertyNPC 6 лет назад
So in Ionic4 you have to make a "
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I think yes.
@QwertyNPC
@QwertyNPC 6 лет назад
For anyone who's wondering: it's in the v4 api reference under back-button. Makes sense if we are no longer using the routing stack.
@zaharouni1
@zaharouni1 6 лет назад
why woocomerse api for ionic only work on android platform?what's the reason of this bug?
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
It does work with IOS, you might need to install whitelist plugin
@kymkhl24
@kymkhl24 6 лет назад
Thanks dude, you should on top of video ionic tutorial. Keep it up
@mohammedrokerya8586
@mohammedrokerya8586 5 лет назад
Great Tutorial! Thanks sir.
@shibnathroy106
@shibnathroy106 5 лет назад
Thanks Sirji. Tussi great ho.
@rajeshrg12
@rajeshrg12 6 лет назад
Very nice tutorial.
@naveenbadidha8586
@naveenbadidha8586 6 лет назад
Which software did u use record screen ?
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I use camtasia studio
@canvaapplessons1224
@canvaapplessons1224 5 лет назад
Can I use it to read and show data of a blogger blog? It has RSS feed. How should I do that? BTW, you've earned a subscriber. 😘
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
Aa RSS feed is in xml format. So, you first have to convert xml to json and then you can read it. Other way is to first fetch the xml and then parse the xml with something like xml2js. Thanks
@oseijuade
@oseijuade 5 лет назад
Good Job You deserve more subscriptions
@manuelmariscal7286
@manuelmariscal7286 5 лет назад
Thank you very much, really interesting, it's a pity that there are not news of Spain yet jajaja
@manuelmariscal7286
@manuelmariscal7286 5 лет назад
Why sometimes news api work and other times its with corrupted image (urlToImage) and kind of? Thanks
@manuelmariscal7286
@manuelmariscal7286 5 лет назад
I have another problem sorry, i realized that every time i change of news, it remains the first news i did the click, why?
@manuelmariscal7286
@manuelmariscal7286 5 лет назад
FINALLY RESOLVED, ionViewWillEnter() IS THE CORRECT METHOD TO UPDATE THE NEWS-DETAIL....
@pulkitaggarwal1897
@pulkitaggarwal1897 6 лет назад
Can you help developing the same kind of app using Firebase back end instead of using http get function from the news api.
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I'll give it a thought
@tonmathew3812
@tonmathew3812 6 лет назад
yes,u can use firebase.the will provide the services like push notification,database etcc
@Jeff99
@Jeff99 5 лет назад
Terrific! Thank you!
@superrat-u7x
@superrat-u7x 6 лет назад
Sir, you are a legend!
@mriganksingh7586
@mriganksingh7586 5 лет назад
{{article.content}} is not showing the complete content it shows some +characters on news-single page
@shuvankarroy2704
@shuvankarroy2704 5 лет назад
The subscription is required for newsapi.org to get full content. By default, developper plan (free) will let you only 260 character content max.
@ashas6218
@ashas6218 6 лет назад
HI, I have created my app in C:\Users\test\ionic_app\myApp. I just installed ionic 4 beta version. Simply loads myApp using ionic serve command. I have not done any coding .its simply for testing. But it loads the URL localhost:8100/ and shows the blank white page in the browser.There is no error in cosole
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
Hi, make sure you have added tabs or sidemenu parameter while creating application
@ashas6218
@ashas6218 6 лет назад
@Baljeet Singh ionic start myApp tabs --type=angular this command used for creating application
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
It seems ok, Have you tried restarting the server
@ashas6218
@ashas6218 6 лет назад
@Baljeet Singh xampp location is in C:\xampp\htdocs.My app folder is in Users\asha.docme\ionic_app\myApp
@ashas6218
@ashas6218 6 лет назад
I am new to coding. I have created some codeigniter works in C:\xampp\htdocs and new to this ionic
@chandni.akhtar06
@chandni.akhtar06 6 лет назад
"tabs.router.module.ts" is not generated in my app ...what should i do...plz help :(
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
Are you adding tabs parameter while creating app?
@fatiharazak7443
@fatiharazak7443 5 лет назад
mee too sir. "tabs.router.module.ts" is not there. I follow step by step your tutorial from the start
@fatiharazak7443
@fatiharazak7443 5 лет назад
Ok sir, i had found the solution. I carelessly identify between tabs and tab1. I had found the tabs.router.module.ts
@rajeevbhosle1580
@rajeevbhosle1580 4 года назад
thank you sir...
@jimohabdulmalik973
@jimohabdulmalik973 6 лет назад
But, y don't you integrate it with Cordova
@tonmathew3812
@tonmathew3812 6 лет назад
not focus on production mode, so no need to integrate with cordova
@nidazehra808
@nidazehra808 5 лет назад
there are no errors...but i am getting a blank screen
@oneeminem2666
@oneeminem2666 6 лет назад
i want to pass google maps api in my ionic 4 app can you help me?
@tonmathew3812
@tonmathew3812 6 лет назад
make Google map api key first
@alfonso94638
@alfonso94638 6 лет назад
what mean "?." when you put on *ngFor directive
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
? Is a safe navigation operator. If we don't use it, initially we might get the property undefined error.
@Mayanktaker
@Mayanktaker 6 лет назад
Sir can you create wordpress ionic 4 tutorial ?? Like showing pages, posts , categories and category archives... ???
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
I might create a tutorial using that
@Mayanktaker
@Mayanktaker 6 лет назад
@@mbaljeetsingh thank you sir. I subscribed to your channel. Its great and very very helpful and straightforward tutorials. 👍🙏🙏🙏
@mbaljeetsingh
@mbaljeetsingh 6 лет назад
You're welcome
@manumaestri
@manumaestri 5 лет назад
Amazing, thank you so much.
@surbhimittal3912
@surbhimittal3912 6 лет назад
Very Nice tutorial, can you please make more tutorials on ionic
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
What do you want me to cover next?
@rvddixit7171
@rvddixit7171 5 лет назад
This will work in angular 7 or not ?
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
It definitely will
@anupsahoo2884
@anupsahoo2884 6 лет назад
thanks for this video tutorial
@RajivKumar-dw2th
@RajivKumar-dw2th 6 лет назад
How to convert this app to installable android apk
@tonmathew3812
@tonmathew3812 6 лет назад
the first thing is that make the project integrate with cordova ,then enter the CLI command ionic cordova build android --prod.Then u will get the apk file
@kamallygowthaman665
@kamallygowthaman665 3 года назад
How to open developer console
@mbaljeetsingh
@mbaljeetsingh 3 года назад
You can press F12 on the keyboard or right click anywhere on the page and select inspect element.
@muthu5665
@muthu5665 5 лет назад
Great tutorial!! Can you post about ionic + woocommerce
@mbaljeetsingh
@mbaljeetsingh 5 лет назад
I might add one in the future
@dhirenpathak
@dhirenpathak 6 лет назад
Good
@angelom.3517
@angelom.3517 3 года назад
Thanks ! Grazie !
@UjjwalKumar-wg4wu
@UjjwalKumar-wg4wu 5 лет назад
great..!
@jimohabdulmalik973
@jimohabdulmalik973 6 лет назад
yeah, thanks for this
Далее
Ionic Framework Crash Course (4.0+)
13:59
Просмотров 95 тыс.
Silent Hill 2 - Мульт Обзор
07:26
Просмотров 260 тыс.
Это было очень близко...
00:10
Просмотров 1,9 млн
Google Data Center 360° Tour
8:29
Просмотров 5 млн
How to Build an Ionic 4 App with Offline Mode
15:03
Просмотров 28 тыс.
Angular 18 is EXACTLY what we needed
9:15
Просмотров 84 тыс.
Ionic 4: Should you Build a Hybrid App?
10:35
Просмотров 255 тыс.
What’s new in Angular v18
20:08
Просмотров 129 тыс.
10 Tools & Services Every Ionic Developer Should Know
21:25