Viva Prep

SimpleAPI = interface jisse systems baat karein. Web API usually JSON return karti hai.

Example

@app.route('/api/lots')
def api_lots():
    return jsonify([{'id': l.id, 'name': l.name} for l in Lot.query.all()])

SimpleMAD1 mein usually session-based auth: login pe session['user_id'], har request pe verify.

Example

session['user_id'] = user.id
uid = session.get('user_id')
user = User.query.get(uid)

Viva tipSECRET_KEY set karo warna session insecure. logout pe session.clear().

SimpleStack bolo: Python, Flask, Jinja2, SQLAlchemy, SQLite, HTML/CSS/Bootstrap, maybe Chart.js.

SimpleJWT teen tukde ki signed chitthi: header.payload.signature. Padhi ja sakti hai, badli nahi ja sakti.

Encoded (Base64) + signed, encrypted nahi (JWE alag). Payload mein password mat daalo — koi jwt.io pe dekh lega.

Login pe server secret se HMAC (HS256). Har API Authorization: Bearer <token>.
Expiry exp. Change payload → signature fail → 401.

Session MAD1 server yaad rakhta. JWT MAD2 client rakhta, server stateless-ish.

Example

eyJhbGciOiJIUzI1NiJ9.{"sub":1,"role":"admin"}.signature
# Authorization: Bearer <token>

Project example: POST /login → token LS. fetch interceptor header. @jwt_required APIs.

Viva tipAlgo HS256. Secret env var. jwt.io pe payload dikhao, secret public site pe mat paste.

SimpleDemo script pehle se practice: 5–7 min, Admin + User roles, saare mandatory features.

Suggested flow1) Register/login user
2) Admin login — CRUD
3) Approval/blacklist
4) Booking/apply + edge case
5) Search
6) Logout

Viva tipBolte-bolte dikhao. Code tab kholna jab poochhein.

SimpleRBAC = Role Based Access Control. Roles (admin/user) se permissions milti hain, har user pe alag list nahi.

Example

if current_user.role != 'admin':
    flash('Not allowed')
    return redirect(url_for('user.home'))

SimpleDemo script pehle se practice: 5–7 min, Admin + User roles, saare mandatory features.

Suggested flow1) Register/login user
2) Admin login — CRUD
3) Approval/blacklist
4) Booking/apply + edge case
5) Search
6) Logout

Viva tipBolte-bolte dikhao. Code tab kholna jab poochhein.

Simplemodels.py = har table ki class: columns, PK/FK, relationships. Yeh Model layer hai.

Suggested flow1) Classes list karo
2) Har table ka kaam 1 line
3) Relationships (1-M / M-M)
4) Constraints (unique, nullable)

Example

class Lot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), nullable=False)
    spots = db.relationship('Spot', backref='lot', lazy=True)

SimpleCode explain formula: input kya aaya → auth/validation → DB change → response/UI.

Viva tipFunction signature + 3-4 important lines + edge case.

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

Simplelogin_required jaisa decorator protected routes pe: session nahi to login redirect.

Example

def login_required(fn):
    @wraps(fn)
    def wrapper(*a, **k):
        if 'user_id' not in session:
            return redirect(url_for('auth.login'))
        return fn(*a, **k)
    return wrapper

Simplejson.dumps Python object ko JSON string banata hai, jsonify Flask Response banata hai (header ke saath).

json.dumps({'ok': True}) → '{"ok": true}' (sirf string)

jsonify(ok=True) → HTTP response, Content-Type: application/json

API route mein jsonify use karo:
@app.route('/api/users')
def users():
    return jsonify([{'id': u.id, 'name': u.name} for u in User.query.all()])

json.dumps se return karoge to browser ise text samajh sakta hai, JSON nahi.

SimpleSFC ek .vue file: template + script + style. Reusable scoped CSS.

Pages route-level. Components andar. Vue 2 one root; Vue 3 fragments.

Component = reusable UI block (Navbar, Card). Props parent→child data, emit child→parent event. Slots parent HTML inner content.

computed cache + reactive derive (filtered list). watch side-effect (query change pe API). methods events. ref() primitive, reactive() object. Vuex/Pinia global store; localStorage persist, store nahi.

SFC: template + script + style ek .vue file. Parent-child exam favourite: list parent, row child :item + @delete.

Example

<template><div>{{ venue.name }}</div></template>
<script>export default { props: ['venue'] }</script>
<style scoped>.card{padding:8px}</style>

Project example: VenueCard.vue props. views/Home.vue page.

SimpleMAD1 frontend usually Jinja templates + HTML/CSS/Bootstrap (+ thoda JS). MAD2 pe Vue ho to clearly bolo.

SimpleRouter URL ko component se map karta hai. Google Maps for pages.

routes array path+component. router-view jagah. router-link reload nahi.

meta.auth + beforeEach guard. Dynamic /venues/:id.

Nayi page: SFC + routes entry + link.

Example

const routes = [
  { path: '/', component: Home },
  { path: '/login', component: Login },
  { path: '/venues/:id', component: VenueDetail, meta: { auth: true } },
]

Project example: routes.js Login, Register, UserHome, AdminHome, 404.

Viva tipNayi page: component banao, routes array mein path, router-link se jao.

SimpleWebSocket ek phone call hai (dono bolte rehte). HTTP postcard hai (ek request-response).

Persistent two-way. Chat, live scores. MAD2 generally REST + kabhi poll.

Webhook ≠ WebSocket. ws:// / wss://.

HTTP postcard (request-response). WebSocket phone call (dono taraf live). SSE radio (server→client stream). Webhook unka server tumhe POST karta hai (payment).

MAD2 mostly REST. Live dashboard = poll + Redis cache kaafi. Agar implement nahi kiya to design bolo, jhoot mat.

Project example: Humne REST use kiya. Live dashboard ke liye poll/cache. WebSocket extra hota.

Viva tipMAD2 mein mostly REST + polling. Webhook ≠ WebSocket.

SimpleJOIN related tables ek result mein. Inner = match only; left = left side sab + match.

Example

db.session.query(Booking, User).join(User).filter(User.id == uid).all()

SimpleJOIN related tables ek result mein. Inner = match only; left = left side sab + match.

Example

db.session.query(Booking, User).join(User).filter(User.id == uid).all()

SimpleJOIN related tables ek result mein. Inner = match only; left = left side sab + match.

Example

db.session.query(Booking, User).join(User).filter(User.id == uid).all()

SimpleDemo script pehle se practice: 5–7 min, Admin + User roles, saare mandatory features.

Suggested flow1) Register/login user
2) Admin login — CRUD
3) Approval/blacklist
4) Booking/apply + edge case
5) Search
6) Logout

Viva tipBolte-bolte dikhao. Code tab kholna jab poochhein.

SimpleClick → Celery → worker CSV → email/download. Columns verify.

csv module. Auth required. Don't freeze UI — 202 + poll.

Examiner 2 cheezein: simple desi line + tumhare project ki exact file.

Pehle ID, GitHub, portal ZIP. Phir run: Redis + Flask + worker + beat + Vue. Feature demo: login, RBAC, cache hit/miss, Celery mail, search.

Line pe ungli: input kahan, kaunsa check, query/cache/task, JSON/UI. Copilot band. Jo nahi kiya honestly bolo + kaise add karte.

Example

@celery.task
def export_venues_csv(user_id):
    rows = Venue.query.all()
    # csv.writer, mail.send
    return 'ok'

Project example: Admin export venues. MailHog attach ya file open.

Viva tipNetwork tab mein job trigger API dikhao, phir MailHog/file open karke columns verify karo.

SimpleVue = UI ka smart assistant. Data badlo, screen khud update. MAD1 Jinja har click pe naya HTML.

Progressive frontend framework. Components, reactivity, directives.

MAD2 SPA: ek index.html, Vue Router pages, Flask sirf JSON.

Fayde: easy, SFC, docs. Vs React: templates HTML-like, course sikhata hai. Vs plain JS: baar-baar DOM mat chhedo.

Example

<!-- HelloWorld.vue -->
<template>
  <h1>{{ msg }}</h1>
</template>
<script>
export default { data() { return { msg: 'Hello' } } }
</script>

Project example: Navbar.vue + views (Login, Dashboard). data() / setup() reactive. fetch APIs.

Viva tipFayde: easy, SFC, reactivity. Vs React: chhota learning curve. Vs plain JS: UI state auto-update.

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

Simplemodels.py = har table ki class: columns, PK/FK, relationships. Yeh Model layer hai.

Suggested flow1) Classes list karo
2) Har table ka kaam 1 line
3) Relationships (1-M / M-M)
4) Constraints (unique, nullable)

Example

class Lot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), nullable=False)
    spots = db.relationship('Spot', backref='lot', lazy=True)

SimpleDemo script pehle se practice: 5–7 min, Admin + User roles, saare mandatory features.

Suggested flow1) Register/login user
2) Admin login — CRUD
3) Approval/blacklist
4) Booking/apply + edge case
5) Search
6) Logout

Viva tipBolte-bolte dikhao. Code tab kholna jab poochhein.

SimpleLive jobs: Redis, worker, beat, crontab abhi, logs + email/CSV.

Scheduled vs user-triggered dono dikhao. Missing feature honestly.

Examiner 2 cheezein: simple desi line + tumhare project ki exact file.

Pehle ID, GitHub, portal ZIP. Phir run: Redis + Flask + worker + beat + Vue. Feature demo: login, RBAC, cache hit/miss, Celery mail, search.

Line pe ungli: input kahan, kaunsa check, query/cache/task, JSON/UI. Copilot band. Jo nahi kiya honestly bolo + kaise add karte.

Suggested flow1) redis
2) worker
3) beat
4) crontab now
5) logs + MailHog

Example

CELERY_BEAT_SCHEDULE = {
  'daily-reminder': {
    'task': 'jobs.daily_reminder',
    'schedule': crontab(hour=18, minute=0),
  },
}

Project example: Change schedule current time. MailHog. Export button 202.

Examiner code pe ungli rakh ke poochta hai — panic mat karo, 4-line formula bolo.

1) Yeh file/line kya role hai (model / route / template / config)?
2) Input kahan se aata hai (form, URL <id>, session, JSON)?
3) DB pe kya query/write?
4) Output kya (render_template / redirect / jsonify)?

Example

@app.route('/book/<int:id>', methods=['POST']) — logged-in user session se, trek id URL se, Booking add, slots--, redirect history.

Unknown line: imports (request, url_for, flash), decorators, if checks, commit — har keyword ka reason ready rakho.

Simplemodels.py = har table ki class: columns, PK/FK, relationships. Yeh Model layer hai.

Suggested flow1) Classes list karo
2) Har table ka kaam 1 line
3) Relationships (1-M / M-M)
4) Constraints (unique, nullable)

Example

class Lot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), nullable=False)
    spots = db.relationship('Spot', backref='lot', lazy=True)

SimpleMAD1 frontend usually Jinja templates + HTML/CSS/Bootstrap (+ thoda JS). MAD2 pe Vue ho to clearly bolo.

SimpleCelery = background naukri. HTTP request ko 10 second email bhejne ke liye mat rokna.

Distributed task queue: aap function ko abhi nahi, worker process mein later/retry/schedule pe chalaate ho.

MAD2 typical jobs: daily reminder mail, monthly HTML report, user-triggered CSV export.

Web request 200ms hona chahiye. 10,000 emails request thread mein = timeout. Worker alag CPU pe kaam kare.

Redis broker chahiye. Beat alag process schedule ke liye.

Example

@celery.task
def daily_reminder():
    for u in User.query.filter_by(active=True):
        send_mail(u.email, 'Book something today!')

Project example: User Export click → 202 Accepted. Worker CSV + email. Daily 6pm Beat reminder.

Viva tipWorker + Redis bina Beat ke user-triggered chalega. Scheduled jobs ke liye Beat bhi chahiye.

SimpleNotepad/jsfiddle: function, map/filter, console.log, debug calmly.

Examiner JSON de sakta hai. filter score>15. Arrow vs function. Don't over-engineer.

Examiner 2 cheezein: simple desi line + tumhare project ki exact file.

Pehle ID, GitHub, portal ZIP. Phir run: Redis + Flask + worker + beat + Vue. Feature demo: login, RBAC, cache hit/miss, Celery mail, search.

Line pe ungli: input kahan, kaunsa check, query/cache/task, JSON/UI. Copilot band. Jo nahi kiya honestly bolo + kaise add karte.

Example

function fullName(first, last) {
  return first + ' ' + last
}
users.filter(u => u.score > 15)

Project example: Practice 10 snippets before viva. Online editor internet if allowed.

SimpleSach bolo. AI se boilerplate/docs theek, logic samajh ke explain karo.

'Boilerplate aur CSS ke liye AI use kiya, models/routes khud design kiye. Report mein X% mention hai.'
Line-by-line nahi explain kar paoge to examiner pakad lega. Documentation: official Flask/SQLAlchemy + course lectures.

SimpleVue = UI ka smart assistant. Data badlo, screen khud update. MAD1 Jinja har click pe naya HTML.

Progressive frontend framework. Components, reactivity, directives.

MAD2 SPA: ek index.html, Vue Router pages, Flask sirf JSON.

Fayde: easy, SFC, docs. Vs React: templates HTML-like, course sikhata hai. Vs plain JS: baar-baar DOM mat chhedo.

Example

<!-- HelloWorld.vue -->
<template>
  <h1>{{ msg }}</h1>
</template>
<script>
export default { data() { return { msg: 'Hello' } } }
</script>

Project example: Navbar.vue + views (Login, Dashboard). data() / setup() reactive. fetch APIs.

Viva tipFayde: easy, SFC, reactivity. Vs React: chhota learning curve. Vs plain JS: UI state auto-update.

Simplemodels.py = har table ki class: columns, PK/FK, relationships. Yeh Model layer hai.

Suggested flow1) Classes list karo
2) Har table ka kaam 1 line
3) Relationships (1-M / M-M)
4) Constraints (unique, nullable)

Example

class Lot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), nullable=False)
    spots = db.relationship('Spot', backref='lot', lazy=True)

SimpleVue = UI ka smart assistant. Data badlo, screen khud update. MAD1 Jinja har click pe naya HTML.

Progressive frontend framework. Components, reactivity, directives.

MAD2 SPA: ek index.html, Vue Router pages, Flask sirf JSON.

Fayde: easy, SFC, docs. Vs React: templates HTML-like, course sikhata hai. Vs plain JS: baar-baar DOM mat chhedo.

Example

<!-- HelloWorld.vue -->
<template>
  <h1>{{ msg }}</h1>
</template>
<script>
export default { data() { return { msg: 'Hello' } } }
</script>

Project example: Navbar.vue + views (Login, Dashboard). data() / setup() reactive. fetch APIs.

Viva tipFayde: easy, SFC, reactivity. Vs React: chhota learning curve. Vs plain JS: UI state auto-update.

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

SimpleCode explain formula: input kya aaya → auth/validation → DB change → response/UI.

Viva tipFunction signature + 3-4 important lines + edge case.

SimpleMAD1 frontend usually Jinja templates + HTML/CSS/Bootstrap (+ thoda JS). MAD2 pe Vue ho to clearly bolo.

Simplesetup() Composition entry — props, context, return state.

script setup syntactic sugar.

Component = reusable UI block (Navbar, Card). Props parent→child data, emit child→parent event. Slots parent HTML inner content.

computed cache + reactive derive (filtered list). watch side-effect (query change pe API). methods events. ref() primitive, reactive() object. Vuex/Pinia global store; localStorage persist, store nahi.

SFC: template + script + style ek .vue file. Parent-child exam favourite: list parent, row child :item + @delete.

Example

export default {
  setup() {
    const n = ref(0)
    return { n }
  }
}

Project example: setup() { const n = ref(0); return { n } }

SimpleComputed naya value return. Watcher side effect (API, log) jab value change.

Search debounce, route param change → watch. Display filter → computed.

Confusion examiner favourite.

Component = reusable UI block (Navbar, Card). Props parent→child data, emit child→parent event. Slots parent HTML inner content.

computed cache + reactive derive (filtered list). watch side-effect (query change pe API). methods events. ref() primitive, reactive() object. Vuex/Pinia global store; localStorage persist, store nahi.

SFC: template + script + style ek .vue file. Parent-child exam favourite: list parent, row child :item + @delete.

Example

watch: {
  query(newQ) { this.fetchSearch(newQ) }
}

Project example: q watch → fetchSearch. remainingSeats computed from capacity-booked.

SimpleonMounted = Composition API ka mounted. setup() ke andar call.

Options API: mounted() method. Mix mat. Vue 3 dono chalte.

Lifecycle = component ki zindagi: created (instance, DOM nahi) → mounted/onMounted (DOM ready — fetch, Chart.js yahi) → updated → unmounted (clearInterval).

Dashboard API created mein isliye nahi ki $el/canvas missing ho sakta. Composition API: onMounted(() => {}) setup ke andar. Options: mounted() method. Mix mat.

Examiner 'konsa hook use kiya' — related .vue kholo, line padh ke bolo.

Example

import { onMounted, ref } from 'vue'
const items = ref([])
onMounted(async () => {
  items.value = await (await fetch('/api/items')).json()
})

Project example: script setup: onMounted(loadStats).

Simpleuselist=False relationship ko list nahi, single object banata hai — one-to-one / many-to-one scalar.

Example

profile = db.relationship('Profile', uselist=False, backref='user')
# user.profile → Profile obj, list nahi

Simplemodels.py = har table ki class: columns, PK/FK, relationships. Yeh Model layer hai.

Suggested flow1) Classes list karo
2) Har table ka kaam 1 line
3) Relationships (1-M / M-M)
4) Constraints (unique, nullable)

Example

class Lot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), nullable=False)
    spots = db.relationship('Spot', backref='lot', lazy=True)

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

SimpleLive coding: notepad/editor mein chhota Flask route / Jinja loop / model field. Calm raho, run karke dikhao.

SimpleORM = Object Relational Mapping. Tables → Python classes. Raw SQL kam likhte ho.

Example

class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    email = db.Column(db.String(120), unique=True)

User.query.get(5)  # SELECT ... WHERE id=5

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

SimpleSach % + kahan + kaise verify + kya seekha. Report se contradict mat.

Boilerplate vs business logic. Examiner process poochta. 'Sab ChatGPT' red flag.

Verify: docs, run, edge case. Seekha: CORS, JWT exp, beat vs worker.

Pehle 1-line definition, phir related MAD2 layer (Vue SFC / Flask route / models.py / tasks.py / Redis).

4-line formula: input kahan se aaya, auth/validation kaunsa, DB ya cache ya Celery, kya return.

Related mix mat karo — cache ≠ Celery, authentication ≠ authorization, v-if ≠ v-show, Beat ≠ Worker. Follow-up ke liye ek difference ready rakho.

Project example: Jo number form/PDF mein hai wahi. Example file jo AI se start kiya, khud debug kiya.

Viva tipExaminer 'kya seekha / kaise check kiya' pe marks. 'Sab ChatGPT' red flag. Jo khud debug kiya woh story ready rakho.

SimpleLevel = viva difficulty band. Level 1 usually demo + basics; higher pe live coding + deeper theory.

Viva tipJo level assign hai uske hisaab se demo + theory ready rakho.

SimpleCamera pe clearly college/IITM ID dikhao — naam aur photo match hone chahiye.

Viva tipPehle se ID haath mein rakho, glare mat aane do. Iske baad GitHub + project run.

SimpleViva wrap-up hai. Short thanks + confirm submission ZIP latest hai.

SimpleTheory = concepts: ORM, MVC, auth vs authz, Jinja inheritance, sessions. 1-line def + project example.

SimpleCelery = background naukri. HTTP request ko 10 second email bhejne ke liye mat rokna.

Distributed task queue: aap function ko abhi nahi, worker process mein later/retry/schedule pe chalaate ho.

MAD2 typical jobs: daily reminder mail, monthly HTML report, user-triggered CSV export.

Web request 200ms hona chahiye. 10,000 emails request thread mein = timeout. Worker alag CPU pe kaam kare.

Redis broker chahiye. Beat alag process schedule ke liye.

Example

@celery.task
def daily_reminder():
    for u in User.query.filter_by(active=True):
        send_mail(u.email, 'Book something today!')

Project example: User Export click → 202 Accepted. Worker CSV + email. Daily 6pm Beat reminder.

Viva tipWorker + Redis bina Beat ke user-triggered chalega. Scheduled jobs ke liye Beat bhi chahiye.

SimpleRedis fridge pe sticky note hai — poori kitchen (database) kholne ki zarurat nahi.

Redis in-memory key-value store hai. Data RAM mein rehta hai, isliye disk wale SQLite/Postgres se kai guna tez.

MAD2 mein Redis do kaam karta hai:
1) Cache — same venue/show/dashboard JSON baar-baar DB se mat nikaalo.
2) Celery message broker — Flask task queue mein daalta hai, worker uthata hai.

Source of truth database hi hai. Redis band ho to cache miss ho jaata hai aur Celery queue ruk sakti hai. Crash pe cache gayab ho sakta hai — isliye important data sirf Redis mein mat rakho.

Example

import redis
r = redis.Redis(host='localhost', port=6379, db=0)
r.set('venues', json.dumps(data), ex=30)
print(r.get('venues'))

Project example: GET /api/venues pehle Redis dekho. Miss pe SQLAlchemy query, phir SET with timeout. Celery worker Redis list se daily reminder uthata hai.

Viva tipCache ke liye db=1, broker ke liye db=0 rakhna smart hai taaki keys mix na hon. Viva mein redis-cli ping → PONG dikhana strong hai.

SimpleCache = pehli baar hisaab karke copy rakh lo, doosri baar copy dikha do.

Baar-baar same expensive kaam (DB query, counting bookings) mat karo. Result Redis jaise store mein timeout ke saath rakh do.

Cache hit: key mil gayi, DB skip. Cache miss: DB se lao, SET karo, return karo.

Tradeoff: speed vs stale data. Admin naya venue add kare aur cache 50s ka ho to user purani list dekh sakta hai — isliye write pe invalidation zaroori hai.

Browser cache, Flask-Caching, Redis alag layers hain. MAD2 examiner Redis + @cache.cached code dekhta hai.

Example

@cache.cached(timeout=50, query_string=True)
@app.route('/api/shows')
def shows():
    return jsonify([s.serialize() for s in Show.query.all()])

Project example: Admin dashboard counts / venues list cache. Create/update/delete ke baad cache.delete('venues').

Viva tipprint('DB queried') function ke andar laga ke miss/hit demo karo — hit pe print nahi chalega.

SimpleJWT teen tukde ki signed chitthi: header.payload.signature. Padhi ja sakti hai, badli nahi ja sakti.

Encoded (Base64) + signed, encrypted nahi (JWE alag). Payload mein password mat daalo — koi jwt.io pe dekh lega.

Login pe server secret se HMAC (HS256). Har API Authorization: Bearer <token>.
Expiry exp. Change payload → signature fail → 401.

Session MAD1 server yaad rakhta. JWT MAD2 client rakhta, server stateless-ish.

Example

eyJhbGciOiJIUzI1NiJ9.{"sub":1,"role":"admin"}.signature
# Authorization: Bearer <token>

Project example: POST /login → token LS. fetch interceptor header. @jwt_required APIs.

Viva tipAlgo HS256. Secret env var. jwt.io pe payload dikhao, secret public site pe mat paste.

SimpleLive coding: notepad/editor mein chhota Flask route / Jinja loop / model field. Calm raho, run karke dikhao.

SimpleVue = UI ka smart assistant. Data badlo, screen khud update. MAD1 Jinja har click pe naya HTML.

Progressive frontend framework. Components, reactivity, directives.

MAD2 SPA: ek index.html, Vue Router pages, Flask sirf JSON.

Fayde: easy, SFC, docs. Vs React: templates HTML-like, course sikhata hai. Vs plain JS: baar-baar DOM mat chhedo.

Example

<!-- HelloWorld.vue -->
<template>
  <h1>{{ msg }}</h1>
</template>
<script>
export default { data() { return { msg: 'Hello' } } }
</script>

Project example: Navbar.vue + views (Login, Dashboard). data() / setup() reactive. fetch APIs.

Viva tipFayde: easy, SFC, reactivity. Vs React: chhota learning curve. Vs plain JS: UI state auto-update.

SimpleLive Flask coding: chhota route likho, save, browser/curl se test. Syntax error terminal mein padho.

Example

@app.route('/ping')
def ping():
    return jsonify(ok=True)

@app.route('/even/<int:n>')
def even(n):
    return 'even' if n % 2 == 0 else 'odd'