Portfolio projects: Angular VS React

FRONTEND FRAMEWORKSPORTFOLIOMERN STACKMEAN STACKREACTREDUXANGULARSPOTIFY CLONEMUSIC APP DEVELOPMENTNETFLIX CLONEWEATHER FORECAST APPRXJSTODO APPWEB DEVELOPER PORTFOLIOCHOOSING THE RIGHT FRAMEWORK

Hey there, sparkly coders! Ready to level up your portfolio by adding a second frontend framework/library to your stack? Buckle up as we dive into some popular portfolio projects and discuss what in my opinion is the best stacks for each of them, with a focus on MERN and MEAN. Let's check out the pros and cons!

Spotify (or any music app)

tl;dr: React + Redux > Vanilla React, but Angular > both

Building a music app is no joke. You need routing, data fetching, and a gazillion components sharing data like it's a party. Now, I've tackled this beast using vanilla JS (yup, DOM manipulation all the way) and also with React (thank you, Redux). And you know what? React with Redux takes the cake here! Cleaner, more readable code - who doesn't want that?

But wait, even with Redux, managing small stuff like changing the volume gets a bit hairy. Dispatch to the store, grab updated data with selectors...phew, it can get messy. Specially when we're talking about tinkering with the player and music.

Now, say hello to Angular! It swoops in with services and BehaviourSubject, making data management a breeze. All data is in one place, and updates happen in real-time. Cleaner code, fewer headaches - that's why I'm diggin' Angular for this one!

My Spotify Clone | VanillaJS

My Spotify Clone | React Typescript (WIP)

Netflix (or any streaming platform)

tl;dr: React is the go-to choice.

Lights, camera, action - let's build a streaming platform clone! Here, you're gonna need data fetching and routing, with the spotlight on the homepage and filtered views. For newbies, you can keep it simple with a couple of Bootstrap carousels. But if you're a UI wizard, go wild with transitions, modals, and even autoplaying videos - show off those skills!

Now, Angular is a contender, but for this gig, I'd pick React (and maybe throw in some Redux too). It's the perfect showstopper for your portfolio. Not that Angular couldn't do it, but React makes your skills shine brighter here, ya know?

Weather Forecast Application

tl;dr: Angular > React + Redux > React (depending on the features)

Got your weatherman hat on? The weather forecast app is like the quintessential Redux project. Lots of info flying around, making you plan architecture like a boss!

So, just like Netflix, you can strut your stuff with React and Redux - a perfect match! But, and here's the twist, if your app packs more punches with sign-ups, sign-ins, and favorites, Angular's your hero! It flexes its form skills and rocks it with rxjs and services.

Bottom line, if it's all about looking pretty with a search bar, React is your main squeeze. But if it's a full-blown app with all the bells and whistles, Angular is your wingman!

Screenshots of my weather app

My Weather App | React + Redux

Todo App

tl;dr: Go with what suits your needs!

Ah, the classic todo app! It's like a rite of passage for any aspiring dev. This one's a free spirit - pick the stack you feel less cozy with, and you'll level up your skills and confidence!

To wrap it up, diversifying your web dev portfolio with these popular projects and different stacks is like unleashing your developer superpowers. Consider the unique demands of each project, weigh those pros and cons, and choose the stack that jives with your goals and talents. Happy coding, my friend! Rock on! 🤘