diff --git a/src/common/AppLayout/components/Sidebar/components/CurrentUser/CurrentUser.tsx b/src/common/AppLayout/components/Sidebar/components/CurrentUser/CurrentUser.tsx
index ff8562d..2eb3625 100644
--- a/src/common/AppLayout/components/Sidebar/components/CurrentUser/CurrentUser.tsx
+++ b/src/common/AppLayout/components/Sidebar/components/CurrentUser/CurrentUser.tsx
@@ -10,7 +10,7 @@ const CurrentUser = () => {
     <Box pr={0.5} pl={0.5}>
       <Typography variant="h6" align="center">
         Jesteś zalogowany jako: <br /> <strong>{user?.displayName}</strong> (ID:{' '}
-        {user?.id}).
+        {user?.id})
       </Typography>
     </Box>
   );
diff --git a/src/common/AppLayout/components/TopBar/TopBar.tsx b/src/common/AppLayout/components/TopBar/TopBar.tsx
index 3aeac77..a523e3f 100644
--- a/src/common/AppLayout/components/TopBar/TopBar.tsx
+++ b/src/common/AppLayout/components/TopBar/TopBar.tsx
@@ -35,11 +35,13 @@ const TopBar = ({ className, openSidebar }: Props) => {
                 <MenuIcon />
               </IconButton>
             </Hidden>
-            <Typography variant="h4">
-              <Link color="inherit" to={ROUTE.DASHBOARD_PAGE}>
-                Zdam Egzamin Zawodowy
-              </Link>
-            </Typography>
+            <Hidden xsDown>
+              <Typography variant="h4">
+                <Link color="inherit" to={ROUTE.DASHBOARD_PAGE}>
+                  Zdam Egzamin Zawodowy
+                </Link>
+              </Typography>
+            </Hidden>
           </div>
           <div className={classes.rightSideContainer}>
             <Button color="inherit" onClick={signOut}>
diff --git a/src/common/Table/Table.tsx b/src/common/Table/Table.tsx
new file mode 100644
index 0000000..e4bba49
--- /dev/null
+++ b/src/common/Table/Table.tsx
@@ -0,0 +1,158 @@
+import React from 'react';
+import { validateRowsPerPage, isObjKey } from './helpers';
+import { Action, Column, OrderDirection } from './types';
+
+import {
+  Table as MUITable,
+  TableBody,
+  TableProps,
+  TableBodyProps,
+  TableContainer,
+} from '@material-ui/core';
+import TableHead from './TableHead';
+import TableRow from './TableRow';
+import TableLoading from './TableLoading';
+import TableEmpty from './TableEmpty';
+import TableFooter, { TableFooterProps } from './TableFooter';
+
+export interface Props<T> {
+  columns: Column<T>[];
+  actions?: Action<T>[];
+  data: T[];
+  orderBy?: string;
+  orderDirection?: OrderDirection;
+  selection?: boolean;
+  idFieldName?: string;
+  getRowKey?: (row: T, index: number) => string | number | null | undefined;
+  onRequestSort?: (
+    orderBy: string,
+    orderDirection: OrderDirection
+  ) => void | Promise<void>;
+  onSelect?: (rows: T[]) => void;
+  loading?: boolean;
+  tableProps?: TableProps;
+  tableBodyProps?: TableBodyProps;
+  footerProps?: TableFooterProps;
+  hideFooter?: boolean;
+  size?: 'medium' | 'small';
+  selected?: T[];
+}
+
+function Table<T>({
+  columns,
+  data,
+  orderBy = '',
+  orderDirection = 'asc',
+  onRequestSort,
+  idFieldName = 'id',
+  selection = false,
+  loading = false,
+  actions = [],
+  tableBodyProps = {},
+  tableProps = {},
+  hideFooter = false,
+  footerProps = {},
+  size,
+  selected,
+  onSelect,
+  getRowKey,
+}: Props<T>) {
+  const headColumns =
+    actions.length > 0
+      ? [...columns, { field: 'action', label: 'Akcje' }]
+      : columns;
+  const preparedFooterProps = {
+    page: 0,
+    rowsPerPage: validateRowsPerPage(
+      footerProps?.rowsPerPage,
+      footerProps?.rowsPerPageOptions
+    ),
+    count: data.length,
+    size: size,
+    ...footerProps,
+  };
+
+  const isSelected = (row: T): boolean => {
+    return (
+      Array.isArray(selected) &&
+      selected.some(
+        otherRow =>
+          isObjKey(otherRow, idFieldName) &&
+          isObjKey(row, idFieldName) &&
+          otherRow[idFieldName] === row[idFieldName]
+      )
+    );
+  };
+
+  return (
+    <TableContainer>
+      <MUITable size={size} {...tableProps}>
+        <TableHead
+          columns={headColumns}
+          selection={selection}
+          orderBy={orderBy}
+          orderDirection={orderDirection}
+          onRequestSort={onRequestSort}
+          size={size}
+          onSelectAll={() => {
+            if (onSelect) {
+              onSelect(data);
+            }
+          }}
+          allSelected={selected?.length === data.length}
+        />
+        <TableBody {...tableBodyProps}>
+          {loading ? (
+            <TableLoading
+              columns={headColumns}
+              size={size}
+              rowsPerPage={preparedFooterProps.rowsPerPage}
+            />
+          ) : data.length > 0 ? (
+            data.map((item, index) => {
+              return (
+                <TableRow
+                  key={
+                    getRowKey
+                      ? getRowKey(item, index)
+                      : isObjKey(item, idFieldName)
+                      ? item[idFieldName] + ''
+                      : index
+                  }
+                  index={index}
+                  row={item}
+                  actions={actions}
+                  selected={isSelected(item)}
+                  selection={selection}
+                  columns={columns}
+                  size={size}
+                  onSelect={row => {
+                    if (onSelect) {
+                      onSelect([row]);
+                    }
+                  }}
+                />
+              );
+            })
+          ) : (
+            <TableEmpty />
+          )}
+        </TableBody>
+        {!hideFooter && (
+          <TableFooter
+            size={size}
+            {...preparedFooterProps}
+            count={
+              loading
+                ? preparedFooterProps.page *
+                  (preparedFooterProps.rowsPerPage + 1)
+                : preparedFooterProps.count
+            }
+          />
+        )}
+      </MUITable>
+    </TableContainer>
+  );
+}
+
+export default Table;
diff --git a/src/common/Table/TableEmpty.tsx b/src/common/Table/TableEmpty.tsx
new file mode 100644
index 0000000..c6e13e9
--- /dev/null
+++ b/src/common/Table/TableEmpty.tsx
@@ -0,0 +1,15 @@
+import React from 'react';
+
+import { TableRow, TableCell, Typography } from '@material-ui/core';
+
+function TableEmpty() {
+  return (
+    <TableRow>
+      <TableCell colSpan={100}>
+        <Typography align="center">Brak danych do wyświetlenia</Typography>
+      </TableCell>
+    </TableRow>
+  );
+}
+
+export default TableEmpty;
diff --git a/src/common/Table/TableFooter.tsx b/src/common/Table/TableFooter.tsx
new file mode 100644
index 0000000..9ed04b8
--- /dev/null
+++ b/src/common/Table/TableFooter.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+
+import {
+  TablePagination,
+  TableRow,
+  TableFooter as MUITableFooter,
+} from '@material-ui/core';
+
+export interface TableFooterProps {
+  page?: number;
+  count?: number;
+  onChangePage?: (page: number) => void;
+  rowsPerPage?: number;
+  onChangeRowsPerPage?: (limit: number) => void;
+  rowsPerPageOptions?: Array<number | { value: number; label: string }>;
+  size?: 'small' | 'medium';
+}
+
+export const ROWS_PER_PAGE_DEFAULT = 25;
+export const ROWS_PER_PAGE_OPTIONS_DEFAULT = [25, 50, 100];
+
+function TableFooter({
+  onChangePage,
+  page = 0,
+  count = 0,
+  onChangeRowsPerPage,
+  rowsPerPageOptions = ROWS_PER_PAGE_OPTIONS_DEFAULT,
+  rowsPerPage = ROWS_PER_PAGE_DEFAULT,
+  size = 'small',
+}: TableFooterProps) {
+  const handlePageChange = (
+    event: React.MouseEvent<HTMLButtonElement> | null,
+    page: number
+  ) => {
+    if (onChangePage) {
+      onChangePage(page);
+    }
+  };
+  const handleRowsPerPageChange = (
+    e: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>
+  ) => {
+    if (onChangeRowsPerPage) {
+      onChangeRowsPerPage(parseInt(e.target.value));
+    }
+  };
+
+  return (
+    <MUITableFooter>
+      <TableRow>
+        <TablePagination
+          count={count}
+          page={page}
+          onChangePage={handlePageChange}
+          onChangeRowsPerPage={handleRowsPerPageChange}
+          rowsPerPage={rowsPerPage}
+          rowsPerPageOptions={rowsPerPageOptions}
+          size={size}
+          colSpan={100}
+          labelDisplayedRows={({ from, to, count }) =>
+            `${from}-${to} z ${count}`
+          }
+          labelRowsPerPage="Wierszy na stronę"
+          nextIconButtonText="Następna strona"
+          backIconButtonText="Poprzednia strona"
+        />
+      </TableRow>
+    </MUITableFooter>
+  );
+}
+
+export default TableFooter;
diff --git a/src/common/Table/TableHead.tsx b/src/common/Table/TableHead.tsx
new file mode 100644
index 0000000..d91e09e
--- /dev/null
+++ b/src/common/Table/TableHead.tsx
@@ -0,0 +1,93 @@
+import React from 'react';
+import { Column, OrderDirection } from './types';
+
+import {
+  TableHead as MUITableHead,
+  TableRow,
+  TableCell,
+  TableSortLabel,
+  Checkbox,
+  SortDirection,
+} from '@material-ui/core';
+
+export interface Props {
+  columns: Column[];
+  selection: boolean;
+  onSelectAll?: () => void;
+  allSelected: boolean;
+  orderDirection: OrderDirection;
+  orderBy: string;
+  size?: 'small' | 'medium';
+  onRequestSort?: (
+    property: string,
+    orderDirection: OrderDirection
+  ) => void | Promise<void>;
+}
+
+function TableHead({
+  columns,
+  onSelectAll,
+  orderBy = '',
+  orderDirection = 'asc',
+  selection = false,
+  allSelected = false,
+  onRequestSort,
+  size = 'medium',
+}: Props) {
+  const createSortHandler = (property: string) => () => {
+    if (onRequestSort) {
+      if (property === orderBy) {
+        onRequestSort(property, orderDirection === 'asc' ? 'desc' : 'asc');
+      } else {
+        onRequestSort(property, 'asc');
+      }
+    }
+  };
+
+  const handleSelectAll = () => {
+    if (onSelectAll) {
+      onSelectAll();
+    }
+  };
+
+  return (
+    <MUITableHead>
+      <TableRow>
+        {selection && (
+          <TableCell size={size} padding="checkbox">
+            <Checkbox checked={allSelected} onClick={handleSelectAll} />
+          </TableCell>
+        )}
+        {columns.map(col => {
+          return (
+            <TableCell
+              size={size}
+              key={col.field}
+              padding={col.disablePadding ? 'none' : 'default'}
+              align={col.align ? col.align : 'left'}
+              sortDirection={
+                (orderBy === col.field
+                  ? orderDirection
+                  : false) as SortDirection
+              }
+            >
+              {col.sortable ? (
+                <TableSortLabel
+                  active={orderBy === col.field}
+                  onClick={createSortHandler(col.field)}
+                  direction={orderBy === col.field ? orderDirection : 'asc'}
+                >
+                  {col.label ?? col.field}
+                </TableSortLabel>
+              ) : (
+                col.label ?? col.field
+              )}
+            </TableCell>
+          );
+        })}
+      </TableRow>
+    </MUITableHead>
+  );
+}
+
+export default TableHead;
diff --git a/src/common/Table/TableLoading.tsx b/src/common/Table/TableLoading.tsx
new file mode 100644
index 0000000..aaf691d
--- /dev/null
+++ b/src/common/Table/TableLoading.tsx
@@ -0,0 +1,31 @@
+import React, { Fragment } from 'react';
+import { Column } from './types';
+
+import { TableRow, TableCell } from '@material-ui/core';
+import { Skeleton } from '@material-ui/lab';
+
+export interface Props {
+  rowsPerPage: number;
+  columns: Column[];
+  size?: 'small' | 'medium';
+}
+
+function TableLoading({ rowsPerPage, columns, size = 'medium' }: Props) {
+  return (
+    <Fragment>
+      {new Array(rowsPerPage).fill(0).map((_, index) => {
+        return (
+          <TableRow key={index}>
+            {columns.map(col => (
+              <TableCell size={size} key={col.field}>
+                <Skeleton variant="text" />
+              </TableCell>
+            ))}
+          </TableRow>
+        );
+      })}
+    </Fragment>
+  );
+}
+
+export default TableLoading;
diff --git a/src/common/Table/TableRow.tsx b/src/common/Table/TableRow.tsx
new file mode 100644
index 0000000..88d7334
--- /dev/null
+++ b/src/common/Table/TableRow.tsx
@@ -0,0 +1,101 @@
+import React from 'react';
+import { get, isString, isNumber } from 'lodash';
+import { format } from 'date-fns';
+import formatNumber from 'utils/formatNumber';
+import { DateFormat } from 'config/app';
+
+import { TableRow, TableCell, Checkbox, Tooltip } from '@material-ui/core';
+
+import { Action, Column } from './types';
+
+export interface Props<T> {
+  actions: Action<T>[];
+  columns: Column<T>[];
+  row: T;
+  selection: boolean;
+  selected: boolean;
+  size?: 'small' | 'medium';
+  index: number;
+  onSelect?: (row: T) => void;
+}
+
+function EnhancedTableRow<T>({
+  actions,
+  columns,
+  row,
+  selection = false,
+  selected = false,
+  onSelect,
+  size = 'medium',
+  index,
+}: Props<T>) {
+  const handleSelect = () => {
+    if (onSelect) {
+      onSelect(row);
+    }
+  };
+
+  const formatValue = (v: string | number | Date, type: Column['type']) => {
+    if ((isString(v) || isNumber(v) || v instanceof Date) && type === 'date') {
+      return format(new Date(v), DateFormat.DayMonthAndYear);
+    }
+    if (
+      (isString(v) || isNumber(v) || v instanceof Date) &&
+      type === 'datetime'
+    ) {
+      return format(new Date(v), DateFormat.HourMinutesDayMonthAndYear);
+    }
+    if ((isString(v) || isNumber(v)) && type === 'number') {
+      return formatNumber('commas', v);
+    }
+    return v;
+  };
+
+  return (
+    <TableRow>
+      {selection && (
+        <TableCell size={size} padding="checkbox">
+          <Checkbox checked={selected} onClick={handleSelect} />
+        </TableCell>
+      )}
+      {columns.map(col => {
+        const val = get(row, col.field, '');
+        return (
+          <TableCell
+            size={size}
+            key={col.field}
+            padding={col.disablePadding ? 'none' : 'default'}
+            align={col.align ? col.align : 'left'}
+          >
+            {col.valueFormatter
+              ? col.valueFormatter(row, index)
+              : col.type
+              ? formatValue(val, col.type)
+              : val}
+          </TableCell>
+        );
+      })}
+      {actions.length > 0 && (
+        <TableCell size={size}>
+          {actions.map((action, index) => {
+            const icon =
+              typeof action.icon === 'function'
+                ? action.icon(row, index)
+                : action.icon;
+            return action.tooltip ? (
+              <div key={index}>
+                <Tooltip key={index} title={action.tooltip}>
+                  <span>{icon}</span>
+                </Tooltip>
+              </div>
+            ) : (
+              <div key={index}>{icon}</div>
+            );
+          })}
+        </TableCell>
+      )}
+    </TableRow>
+  );
+}
+
+export default EnhancedTableRow;
diff --git a/src/common/Table/TableToolbar.tsx b/src/common/Table/TableToolbar.tsx
new file mode 100644
index 0000000..70ce296
--- /dev/null
+++ b/src/common/Table/TableToolbar.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import clsx from 'clsx';
+
+import { makeStyles } from '@material-ui/core/styles';
+import { Toolbar, ToolbarProps } from '@material-ui/core';
+
+export type Props = ToolbarProps;
+
+const useStyles = makeStyles(theme => {
+  return {
+    toolbar: {
+      paddingTop: theme.spacing(1),
+      paddingBottom: theme.spacing(1),
+    },
+  };
+});
+
+function TableToolbar({ children, className, ...rest }: Props) {
+  const classes = useStyles();
+  return (
+    <Toolbar {...rest} className={clsx(classes.toolbar, className)}>
+      {children}
+    </Toolbar>
+  );
+}
+
+export default TableToolbar;
diff --git a/src/common/Table/helpers.ts b/src/common/Table/helpers.ts
new file mode 100644
index 0000000..8b95fdb
--- /dev/null
+++ b/src/common/Table/helpers.ts
@@ -0,0 +1,22 @@
+import {
+  ROWS_PER_PAGE_DEFAULT,
+  ROWS_PER_PAGE_OPTIONS_DEFAULT,
+} from './TableFooter';
+
+export const validateRowsPerPage = (
+  rowsPerPage: number = ROWS_PER_PAGE_DEFAULT,
+  rowsPerPageOptions: Array<
+    number | { value: number; label: string }
+  > = ROWS_PER_PAGE_OPTIONS_DEFAULT
+) => {
+  const opt =
+    rowsPerPageOptions.find(opt =>
+      typeof opt === 'number' ? rowsPerPage === opt : opt.value === rowsPerPage
+    ) ??
+    (typeof rowsPerPageOptions[0] === 'number'
+      ? rowsPerPageOptions[0]
+      : rowsPerPageOptions[0].value);
+  return typeof opt === 'number' ? opt : opt.value;
+};
+
+export const isObjKey = <T>(obj: T, key: any): key is keyof T => key in obj;
diff --git a/src/common/Table/types.ts b/src/common/Table/types.ts
new file mode 100644
index 0000000..6e455c8
--- /dev/null
+++ b/src/common/Table/types.ts
@@ -0,0 +1,16 @@
+export type Action<T> = {
+  icon: React.ReactNode | ((row: T, i: number) => React.ReactNode);
+  tooltip?: string;
+};
+
+export type Column<T = any> = {
+  field: string;
+  label?: string;
+  sortable?: boolean;
+  valueFormatter?: (v: T, i: number) => React.ReactNode;
+  disablePadding?: boolean;
+  type?: 'normal' | 'number' | 'datetime' | 'date';
+  align?: 'left' | 'right' | 'center';
+};
+
+export type OrderDirection = 'asc' | 'desc';
diff --git a/src/config/app.ts b/src/config/app.ts
index 79d3c63..61a8fc9 100644
--- a/src/config/app.ts
+++ b/src/config/app.ts
@@ -2,3 +2,8 @@ export enum Role {
   Admin = 'admin',
   User = 'user',
 }
+
+export enum DateFormat {
+  DayMonthAndYear = 'yyyy-MM-dd',
+  HourMinutesDayMonthAndYear = 'yyyy-MM-dd HH:mm',
+}
diff --git a/src/features/DashboardPage/DashboardPage.tsx b/src/features/DashboardPage/DashboardPage.tsx
index e1b6d76..7c33f64 100644
--- a/src/features/DashboardPage/DashboardPage.tsx
+++ b/src/features/DashboardPage/DashboardPage.tsx
@@ -1,7 +1,7 @@
 import AppLayout from 'common/AppLayout/AppLayout';
 
 const DashboardPage = () => {
-  return <AppLayout>DashboardPage</AppLayout>;
+  return <AppLayout>I'll add something here in the future.</AppLayout>;
 };
 
 export default DashboardPage;
diff --git a/src/utils/formatNumber.ts b/src/utils/formatNumber.ts
new file mode 100644
index 0000000..23cefa4
--- /dev/null
+++ b/src/utils/formatNumber.ts
@@ -0,0 +1,13 @@
+const formatNumber = (variant: 'commas', v: number | string): string => {
+  if (typeof v === 'string') {
+    v = parseFloat(v);
+  }
+  switch (variant) {
+    case 'commas':
+      return v.toLocaleString('en');
+    default:
+      return v + '';
+  }
+};
+
+export default formatNumber;