Summer of Code/2015/Interactive JS Shell - Revision history

Bytestorm: /* About your project */

2015-04-10T00:10:03Z

About your project

← Older revision		Revision as of 20:10, 9 April 2015
Line 61:		Line 61:

	THE NODE.JS SERVER		THE NODE.JS SERVER
	The main server will be Node.js based and would handle the requests sent from the client application. This server is built using the ExpressJS library and the same is used for handling all the requests. This server ~~can also~~ be started on the client device itself which makes it able to run the application even when it's not connected to internet or school LAN.		The main server will be Node.js based and would handle the requests sent from the client application. This server is built using the ExpressJS library and the same is used for handling all the requests. This '''server will be started on the client device itself''' which makes it able to run the application even when it's not connected to internet or school LAN.

	SETTING UP THE CLIENT(SUGAR)		SETTING UP THE CLIENT(SUGAR)

Bytestorm: /* About your project */

2015-04-09T23:44:49Z

About your project

Bytestorm: /* About your project */

2015-04-09T23:40:13Z

About your project

← Older revision		Revision as of 19:40, 9 April 2015
Line 105:		Line 105:
	MATLAB is a very important tool available for any engineering/science field.		MATLAB is a very important tool available for any engineering/science field.
	We can add support for running matlab/octave(.m) codes by using the octave interpreter.		We can add support for running matlab/octave(.m) codes by using the octave interpreter.
	* '''ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''[[File:Final.gif\|centre\|~~1103x1103px~~\|]]		* '''LINK TO ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''
			* [[File:Final.gif\|centre\|1366x1366px\|]]
	* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''		* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''
	[[File:~~SugarTest~~.png\|thumb\|~~1100x1100px~~\|]]		[[File:Vdi2.png\|centre\|thumb\|800x800px\|]]
			* '''DEBUGGING A JAVASCRIPT CODE :'''
	* '''~~RUNNING~~ A JAVASCRIPT CODE :'''		[[File:Vdi3.png\|centre\|thumb\|800x800px\|]]
	[[File:~~JsRan~~.png\|thumb\|~~1100x1100px~~\|\|centre]]		[[File:Vdi4.png\|centre\|thumb\|800x800px\|]]
	* '''RUNNING AN ERRONEOUS JAVASCRIPT CODE :'''		* '''RUNNING AN ERRONEOUS JAVASCRIPT CODE :'''
	[[File:ErrorLog.png\|thumb\|~~1100x1100px~~\|\|centre]]		[[File:ErrorLog.png\|thumb\|800x800px\|\|centre]]
	* '''SAVING A C CODE TO SERVER'''		* '''SAVING A C CODE TO SERVER'''
	[[File:CSaved.png\|centre\|thumb\|~~1100x1100px~~\|]]		[[File:CSaved.png\|centre\|thumb\|800x800px\|]]
	* '''COMPILING AND RUNNING A C CODE (SAVED IN SERVER)'''		* '''COMPILING AND RUNNING A C CODE (SAVED IN SERVER)'''
	[[File:CRan.png\|thumb\|~~1100x1100px~~\|\|~~right~~]]		[[File:CRan.png\|thumb\|800x800px\|\|centre]]
	* '''Who are you making it for, and why do they need it?'''		* '''Who are you making it for, and why do they need it?'''
	I got the motivation for this project from this site [https://try.github.io/levels/1/challenges/1 Github tutorial]. This is very similar to the main idea but also helps the student to learn a language step by step. This is also to make anyone, even with a very little knowledge of the subject, able to make tutorials for fellow students.		I got the motivation for this project from this site [https://try.github.io/levels/1/challenges/1 Github tutorial]. This is very similar to the main idea but also helps the student to learn a language step by step. This is also to make anyone, even with a very little knowledge of the subject, able to make tutorials for fellow students.

Bytestorm: /* About your project */

2015-04-09T23:21:50Z

About your project

← Older revision		Revision as of 19:21, 9 April 2015
Line 81:		Line 81:

	The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.		The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.
	THE VISUAL JS DEBUGGER		'''''THE VISUAL JS DEBUGGER'''''
	The interface ~~has~~ a easy ~~Javascript~~ debugging ~~facility where if~~ the student ~~clicks~~ on a line of the code ~~he/she has written the debugger will return~~ the ~~value~~ of ~~all~~ the declared variables ~~just after execution of that particular line. This task is accomplished by the help of library UglifyJS which parses a given source code and can list out the variables used~~. I have already built a simple debugger and here is a screencast of that - [http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK].		The Visual debugging interface is implemented using '''''UglifyJS '''''library. The '''''UglifyJS.minify() '''''function creates a source code map and extracts the variables used in the program. The source map can be used to parse codes which contain multiline codes (a single line code broken into more than one line), a feature yet to be added.

			To make this feature easy to use this debugging interface is loaded as soon as the program is started. Hence the student just needs to click on any line of the code to see the values of the declared variables there.

			'''I have already built a simple debugger and here is a screencast of that - [http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK].'''
	INTERACTIVE TUTORIALS INTERFACE		INTERACTIVE TUTORIALS INTERFACE

Bytestorm: /* About your project */

2015-04-08T14:24:16Z

About your project

← Older revision		Revision as of 10:24, 8 April 2015
Line 82:		Line 82:
	The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.		The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.
	THE VISUAL JS DEBUGGER		THE VISUAL JS DEBUGGER
	The interface has a easy Javascript debugging facility where if the student clicks on a line of the code he/she has written the debugger will return the value of all the declared variables just after execution of that particular line. This task is accomplished by the help of library UglifyJS which parses a given source code to and can list out the variables used. I have already built a simple debugger and here is a screencast of that - [http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK].		The interface has a easy Javascript debugging facility where if the student clicks on a line of the code he/she has written the debugger will return the value of all the declared variables just after execution of that particular line. This task is accomplished by the help of library UglifyJS which parses a given source code and can list out the variables used. I have already built a simple debugger and here is a screencast of that - [http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK].
	INTERACTIVE TUTORIALS INTERFACE		INTERACTIVE TUTORIALS INTERFACE

Bytestorm: /* About your project */

2015-04-08T14:23:07Z

About your project

← Older revision		Revision as of 10:23, 8 April 2015
Line 81:		Line 81:

	The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.		The tutorial creator is for both teachers and students who have earned some knowledge about JS to help other fellow students. This would not require any further development skill. The teacher/student would have to enter only three things to make tutorial expected input code, expected output code and some explanation/hint/syntax about the input code which would help the student to understand the usage of that command. This application will be packaged with some tutorials during its installation only.
			THE VISUAL JS DEBUGGER
			The interface has a easy Javascript debugging facility where if the student clicks on a line of the code he/she has written the debugger will return the value of all the declared variables just after execution of that particular line. This task is accomplished by the help of library UglifyJS which parses a given source code to and can list out the variables used. I have already built a simple debugger and here is a screencast of that - [http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK].
	INTERACTIVE TUTORIALS INTERFACE		INTERACTIVE TUTORIALS INTERFACE

Line 99:		Line 101:
	MATLAB is a very important tool available for any engineering/science field.		MATLAB is a very important tool available for any engineering/science field.
	We can add support for running matlab/octave(.m) codes by using the octave interpreter.		We can add support for running matlab/octave(.m) codes by using the octave interpreter.
	* '''ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''		* '''ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''[[File:Final.gif\|centre\|1103x1103px\|]]
	* [[File:Final.gif\|centre\|1103x1103px\|]]
	* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''		* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''
	[[File:SugarTest.png\|thumb\|1100x1100px\|]]		[[File:SugarTest.png\|thumb\|1100x1100px\|]]
Line 119:		Line 120:
	The main GUI shown above is build usingJavascript and HTML/CSS.It communicates with a host computer (can be the device running Sugar itself) which is aNodeJSbased server. Support for languages depends on the compilers which are installed in the host computer.		The main GUI shown above is build usingJavascript and HTML/CSS.It communicates with a host computer (can be the device running Sugar itself) which is aNodeJSbased server. Support for languages depends on the compilers which are installed in the host computer.

	I would probably be using the ~~[https://github.com/adobe-research/theseus Thesus]~~ library for visual debugging.		I would probably be using the some JS parser library, UglifyJS for visual debugging.

	For checking flaws in code before running it I am familiar with two tools [http://www.splint.org/ Splint] and [https://github.com/danmar/cppcheck cppcheck]. I am looking into other possible solutions for this part.		For checking flaws in code before running it I am familiar with two tools [http://www.splint.org/ Splint] and [https://github.com/danmar/cppcheck cppcheck]. I am looking into other possible solutions for this part.

Bytestorm: /* About your project */

2015-04-08T11:34:08Z

About your project

← Older revision		Revision as of 07:34, 8 April 2015
Line 99:		Line 99:
	MATLAB is a very important tool available for any engineering/science field.		MATLAB is a very important tool available for any engineering/science field.
	We can add support for running matlab/octave(.m) codes by using the octave interpreter.		We can add support for running matlab/octave(.m) codes by using the octave interpreter.
			* '''ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''
			* [[File:Final.gif\|centre\|1103x1103px\|]]
	* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''		* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''
	[[File:SugarTest.png\|thumb\|1100x1100px\|]]		[[File:SugarTest.png\|thumb\|1100x1100px\|]]

Bytestorm: /* You and the community */

2015-03-28T12:57:34Z

You and the community

← Older revision		Revision as of 08:57, 28 March 2015
Line 157:		Line 157:
	* '''If your project is successfully completed, what will its impact be on the Sugar Labs community? Give 3 answers, each 1-3 paragraphs in length. The first one should be yours. The other two should be answers from members of the Sugar Labs community, at least one of whom should be a Sugar Labs GSoC mentor. Provide email contact information for non-GSoC mentors.'''		* '''If your project is successfully completed, what will its impact be on the Sugar Labs community? Give 3 answers, each 1-3 paragraphs in length. The first one should be yours. The other two should be answers from members of the Sugar Labs community, at least one of whom should be a Sugar Labs GSoC mentor. Provide email contact information for non-GSoC mentors.'''

	My opinion : First of all my answer to why programming is important is that there is a great fun in coding and that's something which will make you keep going to learn more about it. Also it just can't be learned by reading books or attending lectures, you have to try it out. Learning computer is very important to keep up the pace with the outer world. It also help you to understand how these computers, smartphones and those cool gadgets work. To me it is the easiest way to build things.		'''My opinion : '''First of all my answer to why programming is important is that there is a great fun in coding and that's something which will make you keep going to learn more about it. Also it just can't be learned by reading books or attending lectures, you have to try it out. Learning computer is very important to keep up the pace with the outer world. It also help you to understand how these computers, smartphones and those cool gadgets work. To me it is the easiest way to build things.

	Walter: We want our users to be full-fledged participant, hence they need to learn to program. We don't provide as yet any good place for them to learn JS. This is that place.		'''Walter: '''We want our users to be full-fledged participant, hence they need to learn to program. We don't provide as yet any good place for them to learn JS. This is that place.

			'''Tony Anderson: '''One problem is to limit the scope of a project to something that is achievable in the available development time. The interactive tool should assist in working with javascript. The reference text is Eloquent Javascript. In the text there are a large number of examples of javascript illustrating programming concepts using javascript. Part I introduces javascript independent of HTML and CSS. The examples are proven using console.log so this interface needs to be supported.

	* '''What will you do if you get stuck on your project and your mentor isn't around?'''		* '''What will you do if you get stuck on your project and your mentor isn't around?'''

Bytestorm: /* About You */

2015-03-27T16:50:14Z

About You

← Older revision		Revision as of 12:50, 27 March 2015
Line 9:		Line 9:
	bytestorm_		bytestorm_
	* '''What is your first language? (We have mentors who speak multiple languages and can match you with one of them if you'd prefer.)'''		* '''What is your first language? (We have mentors who speak multiple languages and can match you with one of them if you'd prefer.)'''
	~~My first preferred language is~~ English~~. Otherwise I know~~ Bengali and Hindi.		I am comfortable with English, Bengali and Hindi.
	* '''Where are you located, and what hours (UTC) do you tend to work? (We also try to match mentors by general time zone if possible.)'''		* '''Where are you located, and what hours (UTC) do you tend to work? (We also try to match mentors by general time zone if possible.)'''
	India (UTC+5:30)		India (UTC+5:30)

Bytestorm: /* About You */

2015-03-27T16:49:27Z

About You

← Older revision		Revision as of 12:49, 27 March 2015
Line 1:		Line 1:
	==About You==		==About You==
	* '''What is your name?'''		* '''What is your name?'''
	Bishal Santra		My name is Bishal Santra and I am a 3rd year undergraduate student at IIT Kharagpur, India.
	* '''What is your email address?'''		* '''What is your email address?'''
	bsantraigi@gmail.com		bsantraigi@gmail.com

← Older revision		Revision as of 19:44, 9 April 2015
Line 105:		Line 105:
	MATLAB is a very important tool available for any engineering/science field.		MATLAB is a very important tool available for any engineering/science field.
	We can add support for running matlab/octave(.m) codes by using the octave interpreter.		We can add support for running matlab/octave(.m) codes by using the octave interpreter.
	* '''LINK TO ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''		'''''LINK TO ANIMATED GIF OF THE DEBUGGER INTERFACE ([http://wiki.sugarlabs.org/images/f/fe/Final.gif LINK])'''''
	* [[File:~~Final~~.gif\|centre\|~~1366x1366px~~\|]]		* [[File:Final800 anim.gif\|centre\|thumb\|800x800px\|]]
	* '''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''		'''A SCREENSHOT FROM THE SUGAR WEB-ACTIVITY'''
	[[File:Vdi2.png\|centre\|thumb\|800x800px\|]]		[[File:Vdi2.png\|centre\|thumb\|800x800px\|]]
	* '''DEBUGGING A JAVASCRIPT CODE :'''		'''DEBUGGING A JAVASCRIPT CODE :'''
	[[File:Vdi3.png\|centre\|thumb\|800x800px\|]]		[[File:Vdi3.png\|centre\|thumb\|800x800px\|]]
	[[File:Vdi4.png\|centre\|thumb\|800x800px\|]]		[[File:Vdi4.png\|centre\|thumb\|800x800px\|]]
	* '''RUNNING AN ERRONEOUS JAVASCRIPT CODE :'''		'''RUNNING AN ERRONEOUS JAVASCRIPT CODE :'''
	[[File:ErrorLog.png\|thumb\|800x800px\|\|centre]]		[[File:ErrorLog.png\|thumb\|800x800px\|\|centre]]
	* '''SAVING A C CODE TO SERVER'''		'''SAVING A C CODE TO SERVER'''
	[[File:CSaved.png\|centre\|thumb\|800x800px\|]]		[[File:CSaved.png\|centre\|thumb\|800x800px\|]]
	* '''COMPILING AND RUNNING A C CODE (SAVED IN SERVER)'''		'''COMPILING AND RUNNING A C CODE (SAVED IN SERVER)'''
	[[File:CRan.png\|thumb\|800x800px\|\|centre]]		[[File:CRan.png\|thumb\|800x800px\|\|centre]]
	* '''Who are you making it for, and why do they need it?'''		* '''Who are you making it for, and why do they need it?'''