A Customized Chrome New Tab using TypeScript & React.
![Project demo](./asset/TabShaker_Demo.gif)
Chrome Extension: Download
Video Demo in Chinese : YouTube
- In-house user-friendly layout design for adjusting widget placement and smooth position conflict handling.
- User can move / resize widgets with independent placement in different screen sizes.
- Several productivity widgets with responsive visual styling, including:
- Calendar: Connect with Google Calendar through Google OAuth 2 (Verified)
- Note: Markdown editor
- Weather: Geo-location & OpenStreetMap APIs
- English Card: Crawled 16,272 words (Python)
- Clock: SVG text
- News: News API
- To-do List: CRUD to-dos
- Connect to user's Google Calendar
- Handle user log-in through Google OAuth 2
- Handle Google Calendar's data to be shown in FullCalendar
- Two display modes
- Monthly calendar in large size
- Weekly list calendar in small size
- Markdown editor with Lexical
- Convert markdown data to json to be stored
- Show weather forecast
- Editable city name with instant search
- 6 display modes
- Get user's current latitude & longitude through Geo-location API
- Get user's current located city through OpenStreetMap API
- Get city's weather through CWB API
- Collect multi-English-level words using Python
- Random show 5 words everyday
- Play sound of English words's pronunciation
- Show definition, example & API of English Word
- Switch & refresh words
- Multi-level selections
- Get data from Firebase Firestore
- CRUD To-dos
- Title editable
- To-do re-editable
- Filter all / completed / active to-dos
- Show top headlines in multiply countries (selectable)
- Get news data through News API
- flexible font size based on container size
- SVG text
- Calculate available position for adding new widget
- Link to specified url with handling string (with or without https:// )
- Show specified url's favicon
- Debounce to show delete icon
- Switch photos
- Play / Pause playing
- Lazy loading
- Image loading performance fine tune
- Get photos through unsplash APIs
- Link to useful Google tools
- Google OAuth 2
- Google Calendar
- Google Favicon
- Chrome API
- Firebase Firestore
- News API
- Unsplash
- Geo-location
- OpenStreetMap
- CWB (Central Weather Bureau)
MIT license