diff --git a/frontend/src/api/channelsApi.js b/frontend/src/api/chatApi.js
similarity index 74%
rename from frontend/src/api/channelsApi.js
rename to frontend/src/api/chatApi.js
index 9948af3..15ee894 100644
--- a/frontend/src/api/channelsApi.js
+++ b/frontend/src/api/chatApi.js
@@ -1,8 +1,7 @@
 import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
 
-
-export const channelsApi = createApi({
-  reducerPath: 'channels',
+export const chatApi = createApi({
+  reducerPath: 'chatApi',
   baseQuery: fetchBaseQuery({ 
     baseUrl: '/api/v1',
     prepareHeaders: (headers) => {
@@ -17,9 +16,13 @@ export const channelsApi = createApi({
     getChannels: builder.query({
       query: () => 'channels',
     }),
+    getMessages: builder.query({
+      query: () => 'messages',
+    })
   }),
 });
 
 export const {
   useGetChannelsQuery,
-} = channelsApi;
\ No newline at end of file
+  useGetMessagesQuery,
+} = chatApi;
\ No newline at end of file
diff --git a/frontend/src/components/MessageField.jsx b/frontend/src/components/MessageField.jsx
index 9c602cb..110b1ca 100644
--- a/frontend/src/components/MessageField.jsx
+++ b/frontend/src/components/MessageField.jsx
@@ -1,16 +1,29 @@
-import { Container, Row, Col, Nav } from 'react-bootstrap';
+import { useSelector, useDispatch } from 'react-redux';
+import { useTranslation } from 'react-i18next';
+import { activeChannelSelector } from '../store/activeChannelSlice.js';
 import MessageForm from './MessageForm.jsx';
+import { useGetMessagesQuery } from '../api/chatApi.js';
 
 const MessageField = () => {
+    const { t } = useTranslation(); 
+  const { data, error, isLoading, refetch } =  useGetMessagesQuery();
+  const activeChannel = useSelector(activeChannelSelector);
+  const dispatch = useDispatch();
+  const messages = data;
+  const countMessages = messages?.length || 0;
+  console.log(messages)
+
   return (
     <div className="d-flex flex-column h-100">
       <div className="bg-light mb-4 p-3 shadow-sm small">
         <p className="m-0">
-          <b># general</b>
+          <b># {activeChannel.name}</b>
         </p>
-        <span className="text-muted">0 сообщений</span>
+        <span className="text-muted">
+          {t('countMessages.messages', { count: countMessages })}
+        </span>
       </div>
-      <div id="messages-box" className="chat-messages overflow-auto px-5 ">{}</div>
+      <div id="messages-box" className="chat-messages overflow-auto px-5 ">{messages}</div>
       <MessageForm />
     </div>
   );
diff --git "a/frontend/src/components/\320\241hannels.jsx" "b/frontend/src/components/\320\241hannels.jsx"
index f5f9e66..f17b7b3 100644
--- "a/frontend/src/components/\320\241hannels.jsx"
+++ "b/frontend/src/components/\320\241hannels.jsx"
@@ -1,5 +1,5 @@
 import { Nav, Button } from 'react-bootstrap';
-import { useGetChannelsQuery } from '../api/channelsApi.js';
+import { useGetChannelsQuery } from '../api/chatApi.js';
 import { useRef, useEffect } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import { selectActiveTab, activeChannelSelector } from '../store/activeChannelSlice.js';
@@ -11,10 +11,14 @@ const Channels = () => {
   const channelsRef = useRef(null);
   const activeChannel = useSelector(activeChannelSelector);
   useEffect(() => {
+    try {
+      if (isLoading) {
 
+      }
+    } catch (err) {
+      console.log(err);
+    }
   }, []);
-  console.log(channels);
-console.log(activeChannel);
 
 return (
   <Nav 
@@ -26,11 +30,11 @@ return (
     {channels?.map((channel) => {
      return (
       <Nav.Item as="li" key={channel.id} className="w-100">
-        <Button  
+        <Button
           type="button" 
           className="w-100 rounded-0 text-start"
-          variant={channel.id === activeChannel ? "secondary" : ""}
-          onClick={() => dispatch(selectActiveTab({ id: channel.id }))}
+          variant={channel.id === activeChannel.id ? "secondary" : ""}
+          onClick={() => dispatch(selectActiveTab(channel))}
         >
           <span className="me-1"># </span>
            {channel.name}
diff --git a/frontend/src/context/AuthProvider.jsx b/frontend/src/context/AuthProvider.jsx
index 0481186..495d336 100644
--- a/frontend/src/context/AuthProvider.jsx
+++ b/frontend/src/context/AuthProvider.jsx
@@ -6,7 +6,7 @@ import useAuth from '../hooks/index.jsx';
 // eslint-disable-next-line react/prop-types
 const AuthProvider = ({ children }) => {
   const [loggedIn, setLoggedIn] = useState(!!localStorage.getItem('token'));
-  
+
   const token = localStorage.getItem('token');
 
   const logIn = (token, username) => {
diff --git a/frontend/src/locales/ru.js b/frontend/src/locales/ru.js
index b26fcfa..99600dc 100644
--- a/frontend/src/locales/ru.js
+++ b/frontend/src/locales/ru.js
@@ -16,6 +16,11 @@ export default {
       },
       channels: {
         title: 'Каналы',
+      },
+      countMessages: {
+        messages_one: '{{count}} сообщение',
+        messages_fwe: '{{count}} сообщения',
+        messages_many: '{{count}} сообщений',
       }
       // singUpForm: {
       //   username: ''
diff --git a/frontend/src/store/activeChannelSlice.js b/frontend/src/store/activeChannelSlice.js
index 115af18..e7123c3 100644
--- a/frontend/src/store/activeChannelSlice.js
+++ b/frontend/src/store/activeChannelSlice.js
@@ -1,7 +1,13 @@
 import { createSlice } from '@reduxjs/toolkit';
 
+const defaultChannel = {
+  id: '1', 
+  name: 'general', 
+  removable: false,
+};
+
 const initialState = {
-  currentChannel: 1,
+  currentChannel: defaultChannel,
 };
 
 const activeChannelSlice = createSlice({
@@ -9,7 +15,8 @@ const activeChannelSlice = createSlice({
   initialState,
   reducers: {
     selectActiveTab: (state, { payload }) => {
-      state.activeChannel = payload;
+      state.currentChannel = payload;
+      // console.log(payload);
     },
   },
 });
diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js
index f84773c..12edd3f 100644
--- a/frontend/src/store/index.js
+++ b/frontend/src/store/index.js
@@ -1,9 +1,9 @@
 import { combineReducers, configureStore } from '@reduxjs/toolkit';
-import { channelsApi } from '../api/channelsApi.js';
+import { chatApi } from '../api/chatApi.js';
 import activeChannelReducer from './activeChannelSlice.js';
 
 const rootReducer = combineReducers({
-  [channelsApi.reducerPath]: channelsApi.reducer,
+  [chatApi.reducerPath]: chatApi.reducer,
   activeChannel: activeChannelReducer,
   // messages: mesagesReducer,
 });
@@ -11,7 +11,7 @@ const rootReducer = combineReducers({
 const store = configureStore ({
     reducer: rootReducer,
     middleware: (getDefaultMiddleware) =>
-      getDefaultMiddleware().concat(channelsApi.middleware),
+      getDefaultMiddleware().concat(chatApi.middleware),
   });
 
 export default store;
\ No newline at end of file