Angular + TypeScript + Java Full-Stack Interview Cheat Sheet
Angular Cheat Sheet
Core Building Blocks
Component:
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent { title = 'Angular App'; }
Module:
@NgModule({
declarations: [HomeComponent],
imports: [BrowserModule, FormsModule, HttpClientModule],
bootstrap: [HomeComponent]
})
export class AppModule {}
Service:
@Injectable({providedIn:'root'})
export class ApiService {
constructor(private http: HttpClient) {}
getData(){ return this.http.get('/api/data'); }
}
Data Binding
- Interpolation: {{ title }}
- Property: <img [src]="imgUrl">
- Event: <button (click)="onClick()">Click</button>
- Two-way: <input [(ngModel)]="name">
Directives
- Structural: *ngIf, *ngFor
- Attribute: [ngClass], [ngStyle]
- Custom Directive:
@Directive({selector: '[highlight]'})
export class HighlightDirective { /* ... */ }
Dependency Injection
constructor(private api: ApiService) {}
Lifecycle Hooks
- ngOnInit() init logic after bindings
- ngOnChanges() input changes
- ngOnDestroy() cleanup
Routing
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: 'user/:id', component: UserComponent }
];
this.router.navigate(['user', 5]);
Forms
Template-driven:
<form #f="ngForm" (ngSubmit)="submit(f.value)">
<input name="name" ngModel required>
</form>
Reactive:
form = this.fb.group({
name: ['', Validators.required]
});
Observables & RxJS
this.http.get(url).pipe(
map(data => data),
catchError(err => of([]))
).subscribe();
HttpClient
this.http.post('/api', body).subscribe();
Angular CLI
- ng new app
- ng serve
- ng g c my-comp
- ng g s my-service
TypeScript & JavaScript Cheat Sheet
ES6 Essentials
let count = 0;
const PI = 3.14;
const add = (a, b) => a + b;
console.log(`Hello ${name}`);
const {id, name} = obj;
const arr2 = [...arr1, 4, 5];
class Person { constructor(public name: string) {} }
async function fetchData() {
const res = await fetch('/api');
return res.json();
}
TypeScript Features
interface User { id: number; name: string; }
function identity<T>(value: T): T { return value; }
Java Full-Stack Cheat Sheet
OOP
- Encapsulation, Inheritance, Polymorphism, Abstraction
Collections
- List, Set, Map
Exception Handling
try { /* code */ } catch(IOException e) { e.printStackTrace(); } finally { /* cleanup */ }
Multithreading
new Thread(() -> System.out.println("Hello")).start();
Java 8
list.stream().filter(x -> x > 0).forEach(System.out::println);
Spring Boot
@SpringBootApplication
public class App {
public static void main(String[] args) {
SpringApplication.run(App.class, args);
}
}
@RestController
@RequestMapping("/api/users")
public class UserController {
@GetMapping("/{id}")
public User getUser(@PathVariable int id) { return new User(id, "John"); }
}
REST API Basics
- GET, POST, PUT, DELETE
JDBC
Connection con = DriverManager.getConnection(url, user, pass);
PreparedStatement ps = con.prepareStatement("SELECT * FROM users");
ResultSet rs = ps.executeQuery();
Design Patterns
- Singleton, Factory, DAO/Repository
Common Q&A
Q: Constructor vs ngOnInit?
A: Constructor for DI; ngOnInit after bindings.
Q: Observable vs Promise?
A: Observables multiple values; Promise single value.
Q: Checked vs Unchecked exceptions?
A: Checked = compile-time; Unchecked = runtime.
Q: @Component vs @Directive?
A: Component has template; Directive manipulates DOM.
Last-Minute Tips
- Speak plan first
- Code happy path first
- Mention best practices